Facebook のドキュメント (こちら)からコピーした次のコードは、Chrome では機能しません。
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
</script>
Javascript コンソールで次のように表示されます。
Uncaught ReferenceError: FB is not defined
Firefox や Safari の SDK に問題はありません。Chrome だけです。
Facebook スクリプトをブロックする WidgetBlock が Chrome にインストールされているケースを見ました。結果はまさにこのエラーメッセージでした。干渉する可能性のある拡張機能を無効にしてください。
したがって、問題は実際には、初期化が完了するのを待っていないということです。これにより、ランダムな結果が発生します。これが私が使っているものです。
window.fbAsyncInit = function () {
FB.init({ appId: 'your-app-id', cookie: true, xfbml: true, oauth: true });
// *** here is my code ***
if (typeof facebookInit == 'function') {
facebookInit();
}
};
(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
これにより、すべてが読み込まれると、関数facebookInitが使用可能になり実行されます。そうすれば、使用するたびにinitコードを複製する必要がありません。
function facebookInit() {
// do what you would like here
}
このエラーは、fbAsyncInit 定義の後のセミコロンを省略した場合にも表示されます。
window.fbAsyncInit = function() {
FB.init({
appId: 'YOUR APP ID',
status: true,
cookie: true,
xfbml: true
});
//do stuff
}; //<-- semicolon required!
セミコロンがない場合、状況は次の短い例と同じになります。
var x = function () {
console.log('This is never called. Or is it?');
}
('bar');
セミコロンがないと ('bar') の部分が、定義したばかりの関数の呼び出しと見なされるため、関数が呼び出されます。
私もこの問題に遭遇し、それを解決したのはFacebookとは何の関係もありませんが、私が含めた以前のスクリプトは悪い形式でした
<script type="text/javascript" src="js/my_script.js" />
に変更しました
<script type="text/javascript" src="js/my_script.js"></script>
そしてそれは動作します...
ウィー...うまくいけば、私の経験は、ほとんどすべてを行ったが、それでもそれを機能させることができないこれで立ち往生している他の人を助けることができます...
おやおや…^^
FacebookのjavascriptをAJAX経由でロードする非常に厄介なコーディがあり、FB.initを呼び出す前にjsファイルが完全にロードされていることを確認する必要がありました。これは私にとってはうまくいくようです
$jQuery.load( document.location.protocol + '//connect.facebook.net/en_US/all.js',
function (obj) {
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
//ANy other FB.related javascript here
});
このコードは、jquery を使用して JavaScript をロードし、JavaScript の関数コールバック onLoad を実行します。IE6、7、および 8 で最終的にうまく機能しなかったブロックの onLoad イベントリスナーを作成するよりもはるかに面倒ではありません。
非同期読み込みを試す: http://developers.facebook.com/docs/reference/javascript/fb.init/
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>
AdBlock は facebook JS API スクリプトをブロックします。これは、面倒なことが多い facebook 接続に関連しているためです。
この問題がまだ発生しているかどうかはわかりませんが、同じ問題が発生しました。Facebook以外のすべてのWebサイトからFacebookをブロックする拡張機能を実行していたことが判明しました。それを無効にして、働いた！
FB.init が宣言されるまでに時間がかかることがあるため、setTimeout を使用します。
function testAPI() {
console.log('Welcome! Fetching your information.... ');
FB.api('/me', function(response) {
console.log('Good to see you, ' + response.name + '.');
});
}
function login() {
FB.login(function(response) {
if (response.authResponse) {
testAPI();
} else {
// cancelled
}
});
}
setTimeout(function() {
login();
},2000);
私は同じ問題を抱えていましたが、私が見つけた唯一の解決策は、FB ステートメントを使用するすべてのものを init スクリプト内に配置することでした。非同期読み込みも使用したため、コールバック関数は FB を必要とするすべての後にあります。私は一般的なページにphpを動的にロードしているため、多くの部分でphp ifステートメントによって制御されるさまざまなfacebook関数が必要であり、すべてが少し面倒ですが、機能しています!. 読み込みスクリプトから FB 宣言を取り出そうとすると、Firefox は「FB が定義されていません」というメッセージを表示します。それが何かに役立つことを願っています。
スクリプトを Head セクションにロードしてみてください。document.readyさらに、これらのスクリプトを body セクションで定義した場合、次のような呼び出しでスクリプトを定義する方が良いでしょう:
あなたのための解決策があります:)
ウィンドウがロードされた後にスクリプトを実行する必要があります
jQuery を使用する場合は、簡単な方法を使用できます。
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'your-app-id',
xfbml : true,
status : true,
version : 'v2.5'
});
};
(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/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<script>
$(window).load(function() {
var comment_callback = function(response) {
console.log("comment_callback");
console.log(response);
}
FB.Event.subscribe('comment.create', comment_callback);
FB.Event.subscribe('comment.remove', comment_callback);
});
</script>
FB が終了しないという Matty の提案をテストするために、スクリプトにアラートを入れました。これにより、私が制御できる遅延が発生します。案の定…タイミングの問題でした。
$("document").ready(function () {
// Wait...
alert('Click ok to init');
try {
FB.init({
appId: '###', // App ID
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
}
catch (err) {
txt = "There was an error on this page.\n\n";
txt += "Error description: " + err.message + "\n\n";
txt += "Click OK to continue.\n\n";
alert(txt);
}
FB.Event.subscribe('auth.statusChange', OnLogin);
});
私は同じ問題を抱えていて、原因を見つけました。
私はアバストを持っています！コンピューターにアンチウイルスがインストールされていて、chrome プラグインの更新をインストールするように求められました。新しいavast! plugin for chromeには、広告と追跡をブロックする機能があり、デフォルトで Facebook へのアクセスをブロックします。アバストでFacebookを許可するだけで問題を解決しました！必要なウェブサイトの chrome プラグイン。
この質問は非常に古いものなので、新しい avast! クロムプラグイン。
Facebookは、ページに必要な他のスクリプトをブロックしないように、SDKを非同期でロードすることを推奨していますがiframe、FBオブジェクトが完全に作成される前に、コンソールがFBオブジェクトのメソッドを呼び出そうとする可能性があります。 FBはfbAsyncInit関数でのみ呼び出されますが。
javascriptを同期的にロードしてみてください。そうすれば、エラーは発生しなくなります。これを行うには、Facebookが提供するコードをコピーして貼り付け、外部.jsファイルに配置してから、その.jsファイルをページの<script>タグに含め<head>ます。SDKを非同期でロードする必要がある場合は、init関数を呼び出す前に、最初に作成されるFBを確認してください。
私も同じ問題を抱えていました。解決策は、debug.core.js の代わりに core.js を使用することでした。
同様の問題があり、Adblocker Pro であることが判明しました。この拡張機能または他のブロック拡張機能が無効になっていることを確認してください。これにより、約1時間30分を失いました。そのような初心者のように感じます;）
appId プロパティを現在のアプリケーション ID に設定しましたか?
JQueryを使用している場合は、Jquery呼び出しでFBを入れてみてください
例えば
$(document).ready(function(){
FB.Event.subscribe('auth.login', function(){
alert('logged in!');
});
});
それは私のために働いた