JavaScript-SDK – Beispiele

Lies unsere Kurzanleitung durch, um zu erfahren, wie du das Facebook-SDK für JavaScript lädst und initialisierst, sowie unseren Leitfaden für das erweiterte Setup, um deine Implementierung anzupassen. Schaue dir als Nächstes unsere Beispiele für die Nutzung des SDK an:

• Auslösen des Dialogs „Teilen“
• Facebook Login

Auslösen des Dialogs „Teilen“

Über den Dialog „Teilen“ können Nutzer*innen den Link zu einer Seite in ihrer Chronik posten oder eine Open Graph-Meldung erstellen. Über das JavaScript-SDK angezeigte Dialoge werden automatisch für den Kontext formatiert, in dem sie geladen werden: mobiles Web oder Desktop-Web.

Hier zeigen wir dir, wie du mit der FB.ui()-Methode des SDK einen ganz einfachen „Teilen“-Dialog aufrufen kannst. Füge diesen Codeausschnitt nach dem FB.init()-Aufruf im Code des einfachen Setups hinzu:

FB.ui({
  method: 'share',
  href: 'https://developers.facebook.com/docs/'
}, function(response){});
    

Wenn du deine Seite nun erneut lädst, siehst du, dass am Seitenanfang ein „Teilen“-Dialog angezeigt wird. Sobald der Dialog geschlossen wurde, entweder durch Veröffentlichen des Beitrags oder durch Abbrechen, wird die Antwortfunktion ausgelöst.

In unserem FB.uiReferenzdokument findest du eine vollständige Liste der Parameter, die verwendet werden können, sowie die Struktur des Antwortobjekts.

Facebook Login

Facebook Login erlaubt Nutzer*innen, sich mit ihrer Facebook-Identität bei deiner App zu registrieren oder anzumelden.

Wir haben einen umfangreichen Leitfaden dazu, wie du Facebook Login mit dem JS SDK implementieren kannst. Aber fürs Erste verwenden wir nur einfachen Beispielcode, damit du siehst, wie es funktioniert. Füge Folgendes nach deinem ursprünglichen FB.init-Aufruf ein:

FB.login(function(response) {
    if (response.authResponse) {
     console.log('Welcome!  Fetching your information.... ');
     FB.api('/me', function(response) {
       console.log('Good to see you, ' + response.name + '.');
     });
    } else {
     console.log('User cancelled login or did not fully authorize.');
    }
});
    

Im Login-Leitfaden erfährst du, was hier genau passiert. Wenn du aber deine Seite neu lädst, sollte dir der Login-Dialog für deine App angezeigt werden, wenn du ihr noch keine Berechtigung erteilt hast.