Facebook Javascript SDK-Problem:"FB ist nicht definiert"

Question

Der folgende code kopiert aus der Facebook-Dokumentation hier, nicht funktioniert für mich in 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>

In der Javascript-Konsole bekomme ich:

Uncaught ReferenceError: FB is not defined

Ich bin nicht Probleme mit der SDK, Firefox oder Safari nur Chrome.

Answer 1

Ich sah einen Fall, in dem Chrome WidgetBlock installiert hatte, das das Facebook -Skript blockierte. Das Ergebnis war genau diese Fehlermeldung. Stellen Sie sicher, dass Sie alle Erweiterungen deaktivieren, die sich stören können.

Answer 2

Das Problem ist also tatsächlich, dass Sie nicht darauf warten, dass der Init abgeschlossen ist. Dies führt zu zufälligen Ergebnissen. Hier ist, was ich benutze.

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

Dadurch wird sichergestellt, dass die Funktion FacebookInit, sobald alles geladen ist, verfügbar und ausgeführt wird. Auf diese Weise müssen Sie den Init -Code nicht jedes Mal duplizieren, wenn Sie ihn verwenden möchten.

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

Answer 3

Dieser Fehler wird auch angezeigt, wenn Sie das Semikolon nach der Definition von FBasyncinit weglassen.

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

Ohne das Semikolon ist die Situation dieselbe wie in diesem kürzeren Beispiel:

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

('bar');

Die Funktion wird aufgerufen, da ohne das Semikolon der ('Bar') Teil als Aufruf der gerade definierten Funktion angesehen wird.

Answer 4

Ich habe dieses Problem auch begegnet und was es gelöst hat

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

Ich habe es geändert in

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

Und es funktioniert...

WEEW ... hoffentlich kann meine Erfahrung anderen helfen, in diesem zu stecken, was fast alles getan hat, es aber immer noch nicht zum Laufen bringen kann ...

Oh Junge ... ^^

Answer 5

Versuchen Sie es mit asynchronem Laden: 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

Ich hatte einen sehr chaotischen Cody, der das JavaScript von Facebook über Ajax geladen hatte, und ich musste sicherstellen, dass die JS -Datei vollständig geladen wurde

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

Dieser Code verwendet JQuery, um das JavaScript zu laden und den Funktionsrückruf des JavaScripts durchzuführen. Es ist viel weniger chaotischer, als ein Onload -EventListener für den Block zu erstellen, der am Ende auf IE6, 7 und 8 nicht sehr gut funktionierte

Answer 7

Adblock blockiert die Facebook JS -API -Skripte, da es sich um Facebook Connect bezieht, was oft ärgerlich ist.

Answer 8

Ich bin mir nicht sicher, ob Sie dieses Problem noch haben, aber ich hatte nur das gleiche Problem, ich hatte eine Erweiterung, die Facebook von allen Websites blockierte, die nicht Facebook sind. Deaktiviert, arbeitete!

Answer 9

Verwenden Sie einen SetTimeout, da die FB.init manchmal einige Zeit dauert, um deklariert zu werden

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

Versuchen Sie, Ihre Skripte im Kopf zu laden. Darüber hinaus wird es besser, wenn Sie Ihre Skripte unter einem Anruf wie folgt definieren: document.ready, Wenn Sie diese Skripte im Körperbereich definiert haben

Answer 11

Ich hatte das gleiche Problem und die einzige Lösung, die ich gefunden habe, war, alles, was die FB -Anweisung im Init -Skript verwendet habe, auch das Lade von Async zu verwenden, sodass die Rückruffunktion nach allem, was FB benötigt, handelt. Ich habe eine gemeinsame Seite dinamycally mit PHP geladen, so dass viele Teile verschiedene Facebook -Funktionen benötigen, die von PHP gesteuert werden, wenn Aussagen alles ein bisschen chaotisch machen, aber funktioniert!. Wenn ich versuche, eine FB -Erklärung aus dem Ladeskript herauszuholen, zeigt Firefox die Nachricht "FB ist nicht definiert". Hoffe es hilft bei allem.

Answer 12

Um Mattys Vorschläge über FB nicht zu beenden, habe ich eine Warnung in das Skript gesteckt. Dies verursacht eine Verzögerung, die ich kontrollieren könnte. Sicher genug ... es war ein Timing -Problem.

    $("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

Ich hatte das gleiche Problem und habe die Ursache gefunden.

Ich habe Avast! Antivirus in meinem Computer installiert und gebeten mich, das Update für Chrome -Plugin zu installieren. Das neue avast! plugin for chrome Hat die Funktionalität, Anzeigen und Verfolgung zu blockieren, und blockiert standardmäßig den Facebook -Zugriff. Ich habe mein Problem gelöst, einfach Facebook in der Avast zuzulassen! Chrome -Plugin für die Website, die ich benötigte.

Da diese Frage sehr alt ist, denke ich, dass einige Leute die gleiche Ursache haben wie ich, die neue Avast! Chrom -Plugin.

Answer 14

Es gibt eine Lösung für dich :)

Sie müssen Ihr Skript nach dem geladenen Fenster ausführen

Wenn Sie JQuery verwenden, können Sie einen einfachen Weg verwenden:

<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

Ich hatte das gleiche Problem. Die Lösungen sollten Core.js anstelle von debug.core.js verwenden

Answer 16

Facebook bevorzugt es, ihre SDK asynchron zu laden, damit es keine anderen Skripte blockiert, die Sie für Ihre Seite benötigen, jedoch aufgrund der iframe Es besteht die Möglichkeit, dass die Konsole versucht, eine Methode im FB -Objekt aufzurufen, bevor das FB -Objekt vollständig erstellt wird, obwohl FB nur in der aufgerufen wird fbAsyncInit Funktion.
Versuchen Sie, das JavaScript synchron zu laden, und Sie sollten den Fehler nicht mehr erhalten. Dazu können Sie den Code, den Facebook bietet, kopieren und einfügen und in ein extern .js Datei und dann einschließen .js Datei in a <script> Tag in der <head> Ihrer Seite. Wenn Sie ihre SDK asynchron laden müssen, prüfen Sie, ob FB zuerst erstellt wird, bevor Sie das anrufen init Funktion.

Answer 17

Ich hatte ein ähnliches Problem und es stellte sich als Adblocker Pro heraus. Achten Sie darauf, dass diese oder andere Blockierungsverlängerungen deaktiviert wurden. Ich habe aufgrund dessen ungefähr 1 Stunde 30 Minuten verloren. Fühlen Sie sich wie ein Noob;)

Answer 18

Haben Sie die appId-Eigenschaft, um Ihre aktuelle Anwendungs-ID?

Answer 19

Wenn Sie JQuery verwenden, versuchen Sie, FB mit dem JQuery -Anruf zu stecken

z.B

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

Das hat für mich funktioniert