Facebook Javascript SDK问题：“FB未定义”

时间：2010-12-29 18:56:23

标签： javascript google-chrome facebook facebook-javascript-sdk

从Facebook文档here复制的以下代码在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中没有任何问题，只有Chrome。

19 个答案:

答案 0 :(得分：51)

我看到Chrome安装了阻止Facebook脚本的WidgetBlock的案例。结果恰好是此错误消息。确保禁用任何可能会干扰的扩展程序。

答案 1 :(得分：49)

所以问题实际上是你没有等待init完成。这将导致随机结果。这是我使用的。

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
}

答案 2 :(得分：24)

如果在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'）部分被视为对刚刚定义的函数的调用。

答案 3 :(得分：5)

我也遇到了这个问题，解决它的问题与Facebook无关，但我所包含的先前脚本状况不佳

<script type="text/javascript" src="js/my_script.js" />

我把它改成了

<script type="text/javascript" src="js/my_script.js"></script>

它有效......

Weew ...希望我的经验可以帮助其他人坚持这几乎几乎所有事情，但仍然无法让它工作......

哦，男孩...... ^^

答案 4 :(得分：4)

尝试异步加载：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>

答案 5 :(得分：4)

我有一个非常混乱的cody，通过AJAX加载facebook的javascript，我必须确保在调用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并执行函数回调onLoad的javascript。它比为块创建一个onLoad eventlistener要麻烦得多，最后在IE6,7和8上不能很好地工作

答案 6 :(得分：3)

AdBlock会阻止facebook JS api脚本，因为它与facebook连接有关，这通常很烦人。

答案 7 :(得分：2)

不确定你是否仍然遇到这个问题，但我遇到了同样的问题，原来我有一个扩展程序运行，阻止Facebook来自所有不是Facebook的网站。禁用它，工作！

答案 8 :(得分：2)

使用setTimeout，因为有时FB.init需要一些时间来声明

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);

答案 9 :(得分：1)

尝试在Head部分加载脚本。 此外，如果您在一些调用下定义脚本会更好：document.ready，如果您在正文部分中定义了这些脚本

答案 10 :(得分：1)

我有同样的问题，我找到的唯一解决方案是将所有使用FB语句的内容放在init脚本中，我也使用异步加载，因此回调函数是在需要FB的所有内容之后。我有一个常见的页面dinamycally加载PHP这么多的部分需要不同的Facebook功能由PHP控制如果语句使一切有点凌乱，但工作！如果我尝试从加载脚本中取出任何FB声明，则firefox会显示“FB未定义”消息。 希望它对任何事情都有帮助。

答案 11 :(得分：1)

为了测试Mattys关于FB未完成的建议，我在脚本中添加了警告。这导致我可以控制的延迟。果然......这是一个时间问题。

    $("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);
    });

答案 12 :(得分：1)

我遇到了同样的问题而且我找到了原因。

我有avast！我的计算机上安装了防病毒软件，它要求我安装chrome插件的更新。新avast! plugin for chrome具有阻止广告和跟踪的功能，默认情况下，它会阻止Facebook访问。我已经解决了我的问题，只是在avast中允许facebook！我需要的网站的chrome插件。

由于这个问题已经很久了，我认为有些人可能和我有同样的原因，新的avast！ chrome插件。

答案 13 :(得分：1)

有解决方案：）

您必须在加载窗口后运行脚本

如果你使用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>

答案 14 :(得分：0)

我遇到了同样的问题。解决方案是使用core.js而不是debug.core.js

答案 15 :(得分：0)

Facebook更喜欢您异步加载他们的SDK，这样它就不会阻止您的页面所需的任何其他脚本，但由于iframe控制台有可能尝试调用即使仅在fbAsyncInit函数中调用FB，也会在FB对象完全创建之前在FB对象上创建方法 尝试同步加载JavaScript，你不应该再得到错误。为此，您可以复制并粘贴Facebook提供的代码并将其放在外部.js文件中，然后将.js文件包含在<script>标记的<head>中你的网页。如果必须异步加载SDK，则在调用init函数之前先检查是否要创建FB。

答案 16 :(得分：0)

我有一个类似的问题，结果是Adblocker Pro。请务必检查是否已禁用此阻止扩展程序或其他阻止扩展程序。因此，我失去了大约1小时30分钟。感觉像这样的菜鸟;）

答案 17 :(得分：-1)

您是否已将appId属性设置为当前的应用程序ID？

答案 18 :(得分：-2)

如果您正在使用JQuery，请尝试使用Jquery调用FB

e.g。

$(document).ready(function(){
    FB.Event.subscribe('auth.login', function(){
        alert('logged in!');
    });
});

对我有用

相关问题
最新问题