7 Domanda: Uncaught ReferenceError: FB non è definito quando si utilizza FB.getLoginStatus

domanda creata a Wed, Oct 18, 2017 12:00 AM

Sto provando a verificare se un utente ha effettuato l'accesso utilizzando Facebook e ha ricevuto quell'errore nella console JS. Il mio codice è simile a questo:

 
<div id="fb-root"></div>
<script>
    window.fbAsyncInit = function () {
        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
        });
    };

    // Load the SDK Asynchronously
    (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));

    FB.getLoginStatus(function (response) {
        if (response.status === 'connected') {
            // the user is logged in and has authenticated your
            // app, and response.authResponse supplies
            // the user's ID, a valid access token, a signed
            // request, and the time the access token
            // and signed request each expire
            var uid = response.authResponse.userID;
            var accessToken = response.authResponse.accessToken;
        } else if (response.status === 'not_authorized') {
            // the user is logged in to Facebook,
            // but has not authenticated your app
        } else {
            // the user isn't logged in to Facebook.
        }
    });
</script>

Quale potrebbe essere il problema e ci sono suggerimenti su come risolverlo?

    
30
  1. Si sta chiamando FB.getLoginStatus prima che l'SDK sia caricato e /o inizializzato. Per aspettarlo, questo è l'evento fbAsyncInit. Quindi metti la chiamata al metodo qui.
    2013-02-28 19: 17: 59Z
  2. L'ha corretto, grazie!
    2013-02-28 19: 46: 50Z
7 risposte                              7                         

Si sta chiamando FB.getLoginStatus prima che l'SDK sia caricato e /o inizializzato. Per aspettarlo, questo è l'evento fbAsyncInit. Quindi metti la chiamata al metodo qui.

    
43
2013-02-28 19: 48: 56Z
  1. ottimo consiglio. Sposto lo script di caricamento di sdk nella parte superiore della mia pagina javascript.
    2014-06-24 17: 13: 00Z
  2. scusa non ti capisco .. sto ricevendo lo stesso errore cosa dovrei fare?
    2015-09-08 08: 56: 13Z
  3. @ user1735921: è necessario assicurarsi di non chiamare alcun metodo FB prima che l'SDK sia inizializzato. Pertanto, per i metodi che si desidera chiamare "automaticamente" (senza l'interazione dell'utente, ad esempio un clic), è necessario inserirli nella funzione window.fbAsyncInit, dopo la chiamata FB.init.
    2015-09-08 09: 08: 34Z
  4. @ CBroe no, voglio che l'interazione dell'utente avvenga, ho una funzione chiamata login che ha FB.getLoginStatus all'interno di quella funzione, perché ne ho bisogno, e dà me questo errore, anche se ho FB.init definito nel codice come in questa domanda con l'ID app corretto.
    2015-09-08 09: 16: 17Z
  5. @ user1735921 Quindi probabilmente stai chiamando quella funzione all'inizio o qualcosa del genere. Potrebbe essere meglio se hai creato la tua domanda e mostrato il tuo codice completo.
    2015-09-08 09: 25: 42Z

In Chrome, visualizzerai l'errore: Uncaught ReferenceError: FB non definito .

Mi piace attivare un evento personalizzato nella funzione di inizializzazione di Facebook, fbAsyncInit () . Quindi non mi limito a fare tutto il mio script FB all'interno della funzione fbAsyncInit. Posso metterlo ovunque, semplicemente ascoltando che l'evento personalizzato sia licenziato.

 
window.fbAsyncInit = function() {
    FB.init({
        appId      : '123456789',
        status     : true,
        cookie     : true,
        xfbml      : true  
    });

    $(document).trigger('fbload');  //  <---- THIS RIGHT HERE TRIGGERS A CUSTOM EVENT CALLED 'fbload'
};

//MEANWHILE IN $(document).ready()
$(document).on(
    'fbload',  //  <---- HERE'S OUR CUSTOM EVENT BEING LISTENED FOR
    function(){
        //some code that requires the FB object
        //such as...
        FB.getLoginStatus(function(res){
            if( res.status == "connected" ){
                FB.api('/me', function(fbUser) {
                    console.log("Open the pod bay doors, " + fbUser.name + ".");
                });
            }
        });

    }
);
    
52
2014-10-15 18: 54: 04Z
  1. perfetto per me. grazie
    2018-02-07 19: 50: 51Z

Ho usato il seguente approccio semplice e funziona correttamente:

Nella sezione head carico l'SDK:

 
<script type="text/javascript" src="//connect.facebook.net/en_US/sdk.js"></script>

Quindi nel body della pagina in cui si trova il tuo contenuto attuale, ho usato questo:

 
<script>

  function statusChangeCallback(response) {
    console.log('statusChangeCallback');
    console.log(response);
    if (response.status === 'connected') {
      testAPI();

    } else if (response.status === 'not_authorized') {
      FB.login(function(response) {
        statusChangeCallback2(response);
      }, {scope: 'public_profile,email'});

    } else {
      alert("not connected, not logged into facebook, we don't know");
    }
  }

  function statusChangeCallback2(response) {
    console.log('statusChangeCallback2');
    console.log(response);
    if (response.status === 'connected') {
      testAPI();

    } else if (response.status === 'not_authorized') {
      console.log('still not authorized!');

    } else {
      alert("not connected, not logged into facebook, we don't know");
    }
  }

  function checkLoginState() {
    FB.getLoginStatus(function(response) {
      statusChangeCallback(response);
    });
  }

  function testAPI() {
    console.log('Welcome!  Fetching your information.... ');
    FB.api('/me', function(response) {
      console.log('Successful login for: ' + response.name);
      document.getElementById('status').innerHTML =
        'Thanks for logging in, ' + response.name + '!';
    });
  }

  $(document).ready(function() {
    FB.init({
      appId      : '1119999988888898981989819891',
      xfbml      : true,
      version    : 'v2.2'
    });
    checkLoginState();
  });
</script>
    
10
2015-03-13 14: 36: 15Z

Semplicemente usando lo script con sdk di facbook direttamente nel tag

 
    <script type="text/javascript" src="//connect.facebook.net/en_US/all.js#xfbml=1&appId=YOUR_APP_ID" id="facebook-jssdk"></script>
    
2
2017-10-13 14: 22: 29Z

Stavamo affrontando lo stesso problema, e dal momento che FB sdk non si stava caricando (o caricando con ritardi) ciò causava problemi (o rottura di javascript) in alcuni casi che dipendevano da quello.

Per risolvere questo problema, abbiamo delegato tutte le chiamate relative a Facebook. Abbiamo creato una funzione come:

 
function callOnFBSDKLoad(callback){
    if (window.isFBInitialized) {
        callback();
    }
    else {
        jQuery(document).bind('fbInitialized', callback);
    }
}

Dove fbInitialized è un evento personalizzato scopri di più sugli eventi personalizzati qui. E window.isFBInitialized è una variabile impostata quando viene caricato SDK.

callback è il metodo che racchiude gli eventi relativi agli FB. per es.

 
var FBLogin = function(){
   FB.login(...);
}

callOnFBSDKLoad(FBLogin)

PS: Ignora le convenzioni di sintassi e denominazione, fondamentalmente condivido l'idea per risolvere tali problemi.

    
1
2015-12-15 07: 50: 26Z
  1. Grazie per questa coda di chiamate facile da implementare
    2018-09-18 15: 01: 06Z

Una soluzione più semplice e solida. Chiama una funzione quando viene caricato l'SDK. Lo chiamerò triggerLoginCheck().

 
<script>
  window.fbAsyncInit = function() {
    FB.init({
      //TO DO: Add your unique Facebook app ID (All numbers).
      appId      : '***unique_app_id***',
      cookie     : true,
      xfbml      : true,
      version    : 'v2.8'
    });
    //Call the function here
    triggerLoginCheck();

    FB.AppEvents.logPageView();   
  };

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

Più tardi, ovunque, posiziona questo:

 
function triggerLoginCheck() {       
       FB.getLoginStatus(function(response) {
       statusChangeCallback(response);
       console.log(response);  
       });
}
    
0
2017-06-24 19: 00: 53Z
  1. Viene visualizzato lo stesso errore precedente Uncaught ReferenceError: FB is not defined
    2017-07-31 05: 49: 34Z

Funziona bene per me. È necessario includere l'oggetto "Log.info.bind".

 
var Log = { info: { bind: function(){ alert('Hi'); testAPI(); } } }
    
0
2018-09-05 21: 13: 51Z
fonte posta Qui