2013-02-22 13 views
8

Sto utilizzando il codice JavaScript standard di Facebook nella mia app di Facebook, che ho ricevuto nella mia app di esempio su Heroku. Non lo capisco davvero, ma stando attento, sono stato in grado di modificare l'app di esempio per fare alcune cose di base che sono utili per me.Perché Facebook Facebook SDK è caricato in modo asincrono?

La mia comprensione è che questo codice carica in qualche modo l'SDK Javascript di Facebook. Cioè, carica un file di codice javascript. Che file sta caricando davvero? Perché non posso semplicemente caricarlo come carico qualsiasi altro file di codice javascript? Per esempio:

<script type="text/javascript" src="/javascript/jquery-1.7.1.min.js"></script> 

Lo svantaggio di questo approccio altamente complicato è che non riesco a fare testa o croce di esso, e perché io non lo capisco, non ho l'intuizione su come usarlo.

Codice qui:

<script type="text/javascript"> 
    window.fbAsyncInit = function() { 
    FB.init({ 
     appId  : '<?php echo AppInfo::appID(); ?>', // App ID 
     channelUrl : '//<?php echo $_SERVER["HTTP_HOST"]; ?>/channel.html', // Channel File 
     status  : true, // check login status 
     cookie  : true, // enable cookies to allow the server to access the session 
     xfbml  : true // parse XFBML 
    }); 

    // Listen to the auth.login which will be called when the user logs in 
    // using the Login button 
    FB.Event.subscribe('auth.login', function(response) { 
     // We want to reload the page now so PHP can read the cookie that the 
     // Javascript SDK sat. But we don't want to use 
     // window.location.reload() because if this is in a canvas there was a 
     // post made to this page and a reload will trigger a message to the 
     // user asking if they want to send data again. 
     window.location = window.location; 
    }); 

    FB.Canvas.setAutoGrow(); 
    }; 

    // Load the SDK Asynchronously 
    (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/all.js"; 
    fjs.parentNode.insertBefore(js, fjs); 
    }(document, 'script', 'facebook-jssdk')); 
</script> 

risposta

4

Rende il vostro sito di carico più veloce perché non ha bisogno di attendere una risposta dal server facebook.

window.fbAsyncInit è un callback ed è eseguito quando lo script è caricato. Quindi, quando il server di Facebook non funziona, questa funzione non viene mai chiamata.

Quando viene caricata l'API, tutte le funzionalità dell'API sono disponibili. Basta controllare i documenti. http://developers.facebook.com/docs/reference/javascript/

Spero che questo chiarisca.

+4

Perché è necessario utilizzare questa tecnica per l'SDK Javascript di Facebook quando non viene utilizzato praticamente per nessun altro codice Javascript? –

+1

Facebook è uno dei grandi giocatori il cui script viene incorporato in milioni di pagine Web, quindi devono prestare maggiore attenzione ai problemi di prestazioni. E guardandomi attorno penso che scoprirai che altri grandi giocatori di solito raccomandano di incorporare i loro script anche in modo asincrono, per esempio. Google, Twitter, ... – CBroe

+0

E nel caso di Facebook i loro server possono essere lenti in alcuni momenti. Basta fare attenzione quando si carica un pulsante simile. Di solito c'è un leggero ritardo. – Tom