Facebook Developers ページから直接コピーしたコードを使用して、基本的な Facebook の「いいね/シェア」ボタンを Web ページに追加しました。コードには 2 つの部分があります。JavaScript ブロックと、「fb のような」クラスの div タグです。JavaScript は次のとおりです。
<div id="fb-root"></div><script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
ボタンを表示する場所の div タグは次のとおりです。
<div class="fb-like" data-href="http://www.bethcake.com" data-width="90" data-layout="button_count" data-action="like" data-show-faces="false" data-share="true"></div>
私が遭遇している問題は次のとおりです。
Web ページが読み込まれると、2 つの JavaScript 警告が表示されます。警告は、私が書いたコードではなく、connect.facebook.net ソース コードの 233 行目を参照しています。彼らです：
- 無効なアプリ ID: アプリケーション ID を表す数値または数値文字列である必要があります。
- FB.init() を呼び出す前に FB.getLoginStatus() が呼び出されました。
また、ページの読み込み時に、php エラー (like.php.1:948) が表示されます。
- オリジンが「 http://www.facebook.com 」のフレームが、オリジンが「 http://www.bethcake.com 」のフレームにアクセスするのをブロックしました。プロトコル、ドメイン、およびポートが一致する必要があります。
このエラーは不可解です。まず、フレームを使用していません。第二に、プロトコルは一致しており、ポートについては何もありません。もちろん、ドメインは一致しません。Facebook ページの「いいね」を集めようとしているわけではありません。外部サイトの「いいね！」を取得したい。何か不足していますか？
Facebook Open Graph Object Debugger で URL を実行しました。それは私が理解していない多くの警告をもたらしました。彼らです：
- fb:admins および fb:app_id タグがありません。
- og:title、og:type、および og:image がありません。
- og:url、go:title、go:description、および go:image プロパティを明示的に指定する必要があります
じゃ、いいよ。しかし、これらをどこにどのように追加すればよいのでしょうか? Facebook のドキュメントに目を通し、stackoverflow を検索しましたが、成功しませんでした。これらが div タグの data-href 文字列に追加されることになっている場合、例を教えてください。