Facebook Javascript SDK проблема: "FB не определен"

следующий код, скопированный из документации 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

у меня нет проблем с SDK в Firefox или Safari, просто Chrome.

19 ответов


Я видел случай, когда Chrome установил WidgetBlock, который блокировал скрипт Facebook. Результатом было именно это сообщение об ошибке. Убедитесь, что вы отключили все расширения, которые могут помешать.


таким образом, проблема заключается в том, что вы не ждете завершения инициализации. Это приведет к случайным результатам. Вот что я использую.

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 будет доступна и выполнена. Таким образом, вам не нужно дублировать код инициализации каждый раз, когда вы хотите его использовать.

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>

и это работает...

Weew... надеюсь, мой опыт может помочь другим застрять в этом, что сделало почти все, но все еще не может заставить его работать...

О Боже... ^^


Попробуйте Асинхронную Загрузку: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>

У меня был очень грязный код, который загрузил javascript facebook через AJAX, и я должен был убедиться, что файл js был полностью загружен перед вызовом FB.в этом это, кажется, работает для меня

    $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 eventlistener для блока, который в конце концов не очень хорошо работал на IE6, 7 и 8


AdBlock блокирует скрипты api facebook JS, потому что это связано с facebook connect, который часто раздражает.


Не уверен, что у вас все еще есть эта проблема, но у меня была та же проблема, оказалось, что у меня было расширение, которое блокировало Facebook со всех сайтов, которые не являются Facebook. Отключил его, работал!


используйте 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);

попробуйте загрузить свои скрипты в разделе Head. Более того, будет лучше, если вы определите свои скрипты под некоторым вызовом, например:document.ready, Если вы определили эти скрипты в разделе тела


У меня была та же проблема, и единственным решением, которое я нашел, было поместить все, что использовало оператор FB внутри сценария init, я также использовал асинхронную загрузку, поэтому функция обратного вызова после всего, что нужно FB. У меня есть общая страница, dinamycally загруженная php, поэтому многим частям нужны разные функции facebook, контролируемые PHP if, которые делают все немного грязным, но работают!. если я попытаюсь взять любую декларацию FB из сценария загрузки, то firefox покажет " FB не определено" сообщение. Надеюсь, это поможет во всем.


чтобы проверить предложения 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);
    });

У меня была такая же проблема и я нашел причину.

У меня есть avast! антивирус установлен на моем компьютере, и он попросил установить обновление для плагина Chrome. Новый avast! plugin for chrome имеет функциональность для блокировки рекламы и отслеживания, и, по умолчанию, блокирует доступ к facebook. Я решил свою проблему, просто разрешив facebook в avast! плагин chrome для веб-сайта, который мне нужен.

Так как этот вопрос очень старый, я думаю, что некоторые люди могут иметь то же самое потому что, как я, новый avast! плагин хром.


есть решение для вас :)

вы должны запустить скрипт после загрузки окна

Если вы используете 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>

У меня была та же проблема. Решения должны были использовать core.js вместо отладки.ядро.js


Facebook предпочитает, чтобы вы загружали свой SDK асинхронно, чтобы он не блокировал любые другие скрипты, которые вам нужны для вашей страницы, но из-за iframe существует вероятность того, что консоль попытается вызвать метод на объекте FB до того, как объект FB будет полностью создан, даже если FB вызывается только в на <script> в теге <head> вашей страницы. Если вы должны загрузить их SDK асинхронно, проверьте, не будет ли создан FB перед вызовом


У меня была аналогичная проблема, и это оказалось Adblocker Pro. Убедитесь, что этот или другие блокирующие расширения отключены. Из-за этого я потерял около 1hr 30 минут. Почувствуйте себя таким нубом;)


вы установили свойство appId в свой текущий идентификатор приложения?


Если вы используете JQuery, попробуйте поместить FB withing jQuery call

например

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

это сработало для меня