Schnellstart: Facebook-SDK für JavaScript

Das Facebook SDK für JavaScript bietet umfangreiche clientseitige Funktionen, die:

  • es dir ermöglichen, den Button „Gefällt mir“ und andere soziale Plug-ins auf deiner Webseite zu nutzen.
  • es dir ermöglichen, mit Facebook Login die Anmeldung von Personen auf deiner Webseite zu erleichtern.
  • Aufrufe der Facebook Graph API erleichtern.
  • Dialoge starten, mit denen Personen verschiedene Handlungen, wie das Teilen von Geschichten, durchführen können.
  • die Kommunikation erleichtern, wenn du ein Spiel oder einen App-Tab auf Facebook erstellst.

Das SDK, soziale Plugins und Dialoge funktionieren sowohl in Desktop- als auch in mobilen Webbrowsern.

In dieser Kurzanleitung erfährst du, wie du das SDK einrichtest und einige einfache Graph API-Aufrufe damit ausführst. Wenn du das SDK noch nicht einrichten möchtest, kannst du mit unserer JavaScript-Testkonsole alle SDK-Methoden verwenden und einige Beispiele ausprobieren (du kannst die Setup-Schritte überspringen, jedoch den Rest dieser Kurzanleitung in der Konsole testen).

Einfaches Setup

Das Facebook-SDK für JavaScript verfügt über keine eigenständigen Dateien, die du herunterladen oder installieren musst. Stattdessen musst du einfach einen kurzen regulären JavaScript-Codeausschnitt in deine HTML aufnehmen, der das SDK asynchron in deinen Seiten lädt. Durch das asynchrone Laden werden keine Ladevorgänge anderer Elemente deiner Seite blockiert.

Der folgende Codeausschnitt entspricht der einfachen SDK-Version, bei der die Optionen auf die am häufigsten verwendeten Standardwerte gesetzt sind. Du solltest ihn direkt nach dem öffnenden <body>-Tag auf jeder Seite einfügen, auf der er geladen werden soll:

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId            : 'your-app-id',
      autoLogAppEvents : true,
      xfbml            : true,
      version          : 'v2.11'
    });
  };

  (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 = "https://connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>
    

Dieser Code lädt und initialisiert das SDK. Du musst den Wert in your-app-id durch die ID deiner eigenen Facebook-App ersetzen. Diese ID findest du im App-Dashboard.