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

le code suivant, copié à partir de la documentation Facebook ici, 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 Javascript je reçois:

Uncaught ReferenceError: FB is not defined

Je n'ai aucun problème avec le SDK de Firefox ou Safari, juste du Chrome.

38
demandé sur Alex Miller 2010-12-29 21:56:23

19 réponses

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

51
répondu pbz 2011-02-07 00:51:40

donc le problème est en fait que vous n'attendez pas que l'init soit terminé. Cela provoquera des résultats aléatoires. Voici ce que j'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 assurera qu'une fois que tout est chargé, la fonction facebookInit est disponible et exécutée. De cette façon, vous n'avez pas à dupliquer le code d'initialisation à chaque fois que vous souhaitez l'utiliser.

function facebookInit() {
   // do what you would like here
}
49
répondu Matty 2017-10-24 18:15:30

cette erreur s'affichera é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 que dans ce court exemple:

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

('bar');

la fonction est appelée, car sans le point-virgule la partie ('bar') est considérée comme un appel à la fonction juste définie.

23
répondu Todd Kamin 2013-08-30 12:52:53

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

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

je l'ai changé pour

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

Et ça fonctionne...

Weew... avec un peu de chance, mon expérience peut aider d'autres personnes coincées dans ce qui a fait à peu près tout, mais ne peut toujours pas le faire fonctionner...

Oh Boy... ^^

5
répondu Woppi 2011-04-19 09:05:15

Essayez De Chargement Asynchrone: 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>
4
répondu beshkenadze 2010-12-29 19:04:02

j'ai eu un cody très désordonné qui a chargé le javascript de facebook via AJAX et je devais m'assurer que le fichier js a été complètement chargé avant d'appeler FB.initialisation cela 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
      });

ce code utilise jquery pour charger le javascript et faire la fonction callback onLoad du javascript. c'est beaucoup moins désordonné que d'avoir créé un eventlistener onLoad pour le bloc qui finalement ne fonctionnait pas très bien sur IE6, 7 et 8

4
répondu Nick Lim 2012-02-21 06:36:20

AdBlock bloque les scripts de l'api JS facebook parce qu'il est lié à Facebook connect ce qui est souvent ennuyeux.

3
répondu eggie5 2011-04-28 14:20:33

Je ne sais pas si vous avez toujours ce problème, mais j'ai eu le même problème, il s'avère que j'avais une extension qui bloquait Facebook de tous les sites qui ne sont pas Facebook. Désactivé, travaillé!

2
répondu Hosh Sadiq 2011-11-08 11:27:10

Utilisez un setTimeout, parce que parfois le FB.init prend un certain temps pour être déclaré

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);
2
répondu Allan Juliani 2012-12-06 22:14:03

essayez de charger vos scripts dans la Section Head. De plus, ce sera mieux si vous définissez vos scripts sous un appel comme:document.ready, si vous avez défini ces scripts dans la section body

1
répondu Stoic 2010-12-29 19:03:55

j'ai eu le même problème et la seule solution que j'ai trouvée a été de mettre tout ce qui utilise l'instruction FB dans le script d'initialisation, j'ai aussi utilisé le chargement async, donc la fonction de rappel est après tout ce qui a besoin de FB. J'ai une page dinamycally commune chargée avec php tellement de parties ont besoin de différentes fonctions facebook contrôlées par php si les déclarations qui fait tout un peu désordre, mais fonctionne!. si j'essaie de prendre n'importe quelle déclaration FB hors du script de chargement, alors firefox montre le "FB n'est pas défini" message. J'espère que ça aide en quoi que ce soit.

1
répondu Juan 2011-05-26 15:38:57

pour tester les suggestions de Mattys sur le fait que FB ne termine pas, j'ai mis une alerte dans le script. Cela cause un retard que je pourrais contrôler. Bien sûr assez... c'était un problème de synchronisation.

    $("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);
    });
1
répondu Scott Savage 2012-12-28 15:30:52

j'ai eu le même problème et j'ai trouvé la cause.

j'ai de l'avast! antivirus installé dans mon ordinateur, et il m'a demandé d'installer la mise à jour pour le plugin chrome. La nouvelle avast! plugin for chrome a la fonctionnalité de bloquer les annonces et le suivi, et, par défaut, il bloque l'accès facebook. J'ai résolu mon problème en permettant simplement facebook dans l'avast! plugin chrome pour le site dont j'avais besoin.

comme cette question est très ancienne, je pense que certaines personnes pourraient avoir la même parce que comme moi, le nouvel avast! chrome plugin.

1
répondu Diego Malone 2013-11-04 17:26:15

Il y a la solution pour vous :)

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

si vous utilisez jQuery, vous pouvez utiliser la 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>
1
répondu manhhaiphp 2016-06-25 17:15:09

j'ai eu le même problème. Les solutions étaient d'utiliser core.js au lieu de débogage.core.js

0
répondu Mangirdas 2011-06-21 19:42:09

Facebook préfère que vous chargiez leur SDK de façon asynchrone pour qu'il ne bloque pas d'Autres scripts dont vous avez besoin pour votre page mais à cause de iframe il y a une chance que la console essaye d'appeler une méthode sur l'objet FB avant que L'objet FB ne soit complètement créé même si FB est seulement appelé dans le fbAsyncInit fonction.

Essayez de charger le javascript de façon synchrone et vous ne devriez plus avoir l'erreur. Pour ce faire, vous pouvez copier et coller le code que Facebook fournit et de le placer en externe .js le fichier puis de l'inclure .js le fichier <script> dans la balise <head> de votre page. Si vous devez charger leur SDK de façon asynchrone, Vérifiez D'abord si FB est créé avant d'appeler le init fonction.

0
répondu Trevino Jarrett 2012-10-20 02:49:14

j'ai eu un problème similaire et il s'est avéré être Adblocker Pro. Assurez-vous de vérifier que cette extension de blocage ou d'autres ont été désactivées. J'ai perdu environ 1 heure 30 minutes à cause de ça. Se sentir comme un noob ;)

0
répondu rupert_b 2017-03-14 10:43:36

avez-vous défini la propriété appId à votre ID d'application actuel?

-1
répondu sixFingers 2011-05-20 14:02:09

si vous utilisez JQuery, essayez de mettre FB withing jQuery call

e.g.

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

qui a fonctionné pour moi

-2
répondu paulus 2011-11-07 04:45:14