サイトで facebook SDK を開始する次のコードがあります (警告、いくつかの機能を削除し、名前空間を削除しました。これは、この議論に追加されないためです)。
var facebookAppId = "501843009849438";
var facebookEvents = (function(){
var facebookHasLoaded = false;
var asyncLoadFacebook = function() {
// exposed to window because it is called by facebook
window.fbAsyncInit = function() {
FB.init({
appId : facebookAppId, // App ID
channelUrl : '//'+location.host+'/nl/recommendations/facebook/channel.html', //Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
// Load the SDK asynchronously
(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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
facebookHasLoaded = true;
};
return {
enable: function() {
if (!facebookHasLoaded) {
jQuery('body').append('<div id="fb-root" />');
asyncLoadFacebook();
}
}
};
})();
// If there are no fb-like's found, we don't auto-start and you should manually load .enable().
jQuery(document).ready(function(){
if (jQuery('.fb-like').length !== 0) {
facebookEvents.enable();
}
});
この JavaScript は、サイトのすべてのページに読み込まれるファイルに配置されます。すべてのページに SDK をロードしたくないため、「document.ready」にチェックが追加されました。
それを修正するため に私がしたことは、Chromeにブレークポイントを配置したことで、asyncLoadFacebook関数にうまく入りました。また、ページの div 内に iframe を取得します。developers.facebook.com を試してみました。また、インターウェブに関する多くのフォーラムを読んでください。facebook グラフを介して appId を再確認しました。これは正しい appId です。
いいねボタンの HTML これは、いいねボタンを表示するために使用する div です。
<div class="fb-like" data-href="${canonicalURLEncoded}" data-send="false" data-layout="button_count" data-width="150" data-show-faces="false" data-font="verdana"></div>
ページをロードするときに「間違っている」唯一のことは、次のような多くのエラーメッセージが表示されることです。
Blocked a frame with origin "http://****************" from accessing a frame with origin "https://s-static.ak.facebook.com". The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "https". Protocols must match.
ただし、スクリプトの URL を呼び出すときにコード内で http や https を使用することはありません (スクリプト サンプルで確認できます)。いいねボタンのあるページはhttpです。さらに、Google plus はコンソールに同じログを表示しますが、plusone ボタンは正常に機能します。
インライン化は できません 残念ながら、展開してテストすることはできません。特にインライン JavaScript (本文の直後) はオプションではありません。非同期バージョンが機能することを本当に望んでいます..