Facebook Javascript SDK Problème: « FB n'est pas défini »

Question

Le code suivant, copié à partir de la documentation Facebook, ne fonctionne pas pour moi dans 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>

Dans la console I Javascript obtenir:

Uncaught ReferenceError: FB is not defined

Je ne suis pas avoir de problèmes avec le SDK dans Firefox ou Safari, Chrome seulement.

Answer 1

J'ai vu un cas où Chrome avait installé WidgetBlock qui bloquait le script Facebook. Le résultat a été exactement ce message d'erreur. Assurez-vous de désactiver toutes les extensions qui peuvent interférer.

Answer 2

Donc, la question est en fait que vous n'êtes pas en attente pour le init complet. Cela entraînera des résultats aléatoires. Voici ce que je l'utilise.

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

Cela permettra d'assurer que tout est une fois chargé, la fonction facebookInit est disponible et exécuté. De cette façon, vous ne devez pas dupliquer le code d'initialisation à chaque fois que vous voulez utiliser.

function facebookInit() {
   // do what you would like here
}

Answer 3

Cette erreur apparaît également si vous omettez le point-virgule après la définition de fbAsyncInit.

window.fbAsyncInit = function() {
    FB.init({
        appId: 'YOUR APP ID',
        status: true,
        cookie: true,
        xfbml: true
    });
    //do stuff
}; //<-- semicolon required!

Sans le point-virgule, la situation est la même chose que dans cet exemple plus court:

var x = function () {
    console.log('This is never called. Or is it?');
}

('bar');

La fonction est appelée, parce que sans la virgule ( « bar ») une partie est considérée comme un appel à la fonction vient d'être défini.

Answer 4

J'ai rencontré ce problème aussi et résolu ce qui n'a rien à voir avec Facebook, mais le script avant que j'inclus qui était en mauvaise forme

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

Je l'ai changé à

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

Et ça marche ...

Weew ... Je espère que mon expérience peut aider les autres coincé dans ce qui a fait presque de tout, mais ne peut toujours pas obtenir au travail ...

Oh Boy ... ^^

Answer 5

Essayez Asynchronous Chargement: 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>

Answer 6

J'ai eu une très salissant cody que le javascript chargé de facebook via AJAX et je devais faire en sorte que le fichier js a été complètement chargée avant d'appeler FB.init ce semble fonctionner pour moi

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

Il utilise du code JQuery pour charger le javascript et faire le rappel de la fonction OnLoad du javascript. il est beaucoup moins messier que d'avoir la création d'un EventListener onLoad pour le bloc qui à la fin ne fonctionne pas très bien sur IE6, 7 et 8

Answer 7

blocs AdBlock les scripts JS facebook api parce qu'il est lié à Facebook Connect qui est souvent ennuyeux.

Answer 8

Je ne sais pas si vous avez encore ce problème, mais je viens d'avoir le même problème, j'avais tourné une course d'extension qui bloquait Facebook de tous les sites qui ne sont pas Facebook. Personnes handicapées il, travaillé!

Answer 9

Utilisez un setTimeout, parce que parfois le FB.init prend un certain temps pour se déclarer

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

Answer 10

Essayez de charger vos scripts dans la section Head. De plus, il sera mieux si vous définissez vos scripts sous un appel comme: document.ready, si vous avez défini ces scripts dans la section du corps

Answer 11

J'ai eu le même problème et la seule solution que j'ai trouvé tout mettre qui a utilisé l'instruction FB dans le script d'initialisation, j'ai aussi utilisé async chargement, de sorte que la fonction de rappel est après tout ce qui a besoin FB. J'ai une page commune dinamycally chargé avec php tant de pièces différentes fonctions ont besoin de facebook contrôlées par php si des déclarations qui fait tout un désordre de peu, mais est de travailler !. si je tente de prendre toute déclaration de FB sur le script de chargement, puis Firefox affiche le message « FB n'est pas défini ». L'espoir qu'il aide à quoi que ce soit.

Answer 12

Pour tester des suggestions à propos de FB Mattys ne pas finir, je une alerte dans le script. Cette cause un retard que je pouvais contrôler. Effectivement ... il était une question de temps.

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

Answer 13

J'ai eu le même problème et je l'ai trouvé la cause.

Je avast! antivirus installé sur mon ordinateur, et il m'a demandé d'installer la mise à jour pour le chrome plugin. Le nouveau avast! plugin for chrome a la fonctionnalité aux annonces de bloc et de suivi, et, par défaut, il bloque l'accès facebook. J'ai résolu simplement mon problème permettant facebook dans le avast! chrome plug-in pour le site que je avais besoin.

Étant donné que cette question est très ancienne, je pense que certaines personnes pourraient avoir la même cause que moi, le nouveau avast! plug-in chrome.

Answer 14

Il y a une solution pour vous:)

Vous devez exécuter votre script après la fenêtre chargé

si vous utilisez jQuery, vous pouvez utiliser de manière simple:

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

Answer 15

J'ai eu le même problème. Les solutions consistait à utiliser core.js au lieu de debug.core.js

Answer 16

Facebook préfère que vous chargez leur SDK de manière asynchrone afin qu'il ne bloque pas d'autres scripts que vous avez besoin pour votre page, mais en raison de la iframe il y a une chance que les essais de la console d'appeler une méthode sur l'objet FB avant le FB objet est complètement créé, même si FB n'est appelée dans la fonction fbAsyncInit.
Essayez de charger le javascript synchrone et vous ne devriez pas obtenir plus l'erreur. Pour ce faire, vous pouvez copier et coller le code que Facebook offre et placez-le dans un fichier .js externe et ensuite inclure ce fichier .js dans une balise <script> dans la <head> de votre page. Si vous devez charger leur SDK de manière asynchrone, puis vérifier FB à créer d'abord avant d'appeler la fonction init.

Answer 17

J'ai eu un problème similaire et il est avéré être Adblocker Pro. Assurez-vous de vérifier que ceci ou d'autres extensions de blocage ont été désactivées. J'ai perdu environ 1 heure 30 minutes en raison de cela. Sentez-vous comme un Noob;)

Answer 18

Avez-vous définissez la propriété appId à votre ID d'application actuelle?

Answer 19

Si vous utilisez JQuery, essayez de mettre FB appel Jquery sont acceptés dans les

par exemple.

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

qui a fonctionné pour moi