2011-11-11 2 views
58

Perché abbiamo bisogno di aggiungere questi due tag all'interno della nostra applicazione Facebook. A che cosa servono queste coppie di tag. Ho creato un'applicazione che utilizza un apprequest e funziona bene anche se non aggiungo questi tag davanti ai miei script. Quindi mi chiedo davvero perché dobbiamo aggiungerli. Grazie.Perché dobbiamo aggiungere <div id="fb-root"></div>

risposta

45

È il segnaposto per lo script javascript di Facebook per collegare elementi al DOM. Senza questo, quando viene eseguito lo script di Facebook di riferimento, non è in nessun posto possibile allegare elementi.

È possibile vedere fb-root viene aggiunto come parte dell'inizializzazione.

<script type="text/javascript"> 
     window.fbAsyncInit = function() { 
     FB.init({appId: 'xxxxxx', status: true, cookie: true, 
       xfbml: true}); 
     }; 

     (function() { 
     var e = document.createElement('script'); e.async = true; 
     e.src = document.location.protocol + 
      '//connect.facebook.net/en_US/all.js'; 
     document.getElementById('fb-root').appendChild(e); 
     }()); 
    </script> 
+2

Questo è un esempio di utilizzo di javascript non invadente. – Teddy

+0

ciao qualcuno nota che lo

farà sì che il tuo https: // non sia sicuro ?? Quando punto direttamente il browser in https: //.../myfb_app/ il file non viene analizzato come sicuro se ho il
ma quando lo rimuovo, l'intero file viene analizzato come sicuro. Eventuali suggerimenti?? – alex

+5

Non potrebbero aggiungere direttamente alla testa? –

31

UPDATE: Facebook non è più necessario includere <div id="fb-root"></div> nel codice HTML.

Ora è possibile rimuoverlo. L'SDK Javascript di Facebook lo crea da solo, aggiungendolo al tag BODY. Neanche gli avvisi vengono visualizzati nella console, come prima.

La documentazione di Facebook è stata aggiornata, non mostrando più il requisito <div id="fb-root"></div>.

Vecchio documentazione per la versione 1.0 (mostra <div id="fb-root"></div>): https://developers.facebook.com/docs/javascript/quickstart/v1.0

documentazione di corrente per la versione 2.5 (non mostra più <div id="fb-root"></div>): https://developers.facebook.com/docs/javascript/quickstart/v2.5

+0

Eccetto che sembra che abbiamo problemi come [questo] (http://stackoverflow.com/questions/24019877/fb-init-function-gives-wrong-version-error). – mgalgs

+0

@mgalgs: Leggendo questi commenti, non sembra che qualcuno abbia trovato una soluzione per qualunque cosa causasse il problema dell'OP. Quindi non direi che aggiungere il tag div è una correzione per qualsiasi cosa.Se c'era un problema, sono passati 2 anni e sono sicuro che sia risolto da Facebook.L'opzione migliore è seguire i loro consigli sul codice, che non includono quel tag div. –

+0

v2.8 mostra un avvertimento ... –

-1

diventa ancora più semplice con Turbolinks 5. Hai solo bisogno di aggiungi data-turbolinks-permanent=true al div fb-root e verrà mantenuto tra le richieste. Non c'è bisogno di giocherellare con il javascript.