Zum Hauptinhalt springen

Soziale Anmeldung mit Facebook einrichten (Set up social login with Facebook)

Integriere das Facebook OAuth 2.0-Authentifizierungssystem, um „Mit Facebook anmelden“, Kontoverknüpfung und sicheren Zugriff auf Facebook APIs zu ermöglichen.

tipp:

Diese Anleitung setzt voraus, dass du ein grundlegendes Verständnis von Logto Connectors hast. Für diejenigen, die damit nicht vertraut sind, verweisen wir auf die Connectors Anleitung, um loszulegen.

Erste Schritte​

Der Facebook Connector ermöglicht die OAuth 2.0-Integration, damit deine Anwendung:

  • Die Authentifizierung „Mit Facebook anmelden“ hinzufügen kann
  • Benutzerkonten mit Facebook-Identitäten verknüpfen kann
  • Benutzerprofilinformationen von Facebook synchronisieren kann
  • Auf Facebook APIs über sichere Token-Speicherung im Logto Secret Vault für Automatisierungsaufgaben zugreifen kann (z. B. auf Threads antworten; Inhalte und Videos in deiner App veröffentlichen)

Um diese Authentifizierungsfunktionen einzurichten, erstelle zuerst einen Facebook Connector in Logto:

  1. Gehe zu Logto > Connector > Social connector.
  2. Klicke auf Sozialen Connector hinzufügen, wähle Facebook, klicke auf Weiter und folge dem Schritt-für-Schritt-Tutorial, um die Integration abzuschließen.

Schritt 1: Eine App im Facebook App Dashboard einrichten​

Bevor du Facebook als Authentifizierungsanbieter verwenden kannst, musst du eine App auf der Facebook-Entwicklerplattform einrichten, um OAuth 2.0-Zugangsdaten zu erhalten.

  1. Registriere dich als Facebook-Entwickler, falls du noch kein Konto hast.
  2. Besuche die Seite Apps.
  3. Klicke auf deine bestehende App oder erstelle eine neue, falls nötig.
tipp:

Ein Anwendungsfall ist die primäre Art und Weise, wie deine App mit Meta interagiert und bestimmt, welche APIs, Funktionen, Berechtigungen und Produkte deiner App zur Verfügung stehen. Wenn du nur soziale Authentifizierung benötigst (um E-Mail & public_profile zu erhalten), wähle „Authentifizierung und Anfragedaten von Benutzern mit Facebook Login“. Wenn du auf Facebook-APIs zugreifen möchtest, wähle deine bevorzugten Anwendungsfälle – die meisten unterstützen auch die Integration von „Facebook Login for business“ nach der App-Erstellung.

  1. Nach der App-Erstellung navigiere im App-Dashboard zu Use cases > Facebook Login > Settings oder Facebook Login for business > Settings.
  2. Fülle das Feld Valid OAuth Redirect URIs mit der Logto Callback URI aus (kopiere diese aus deinem Logto Facebook Connector). Nachdem sich Benutzer mit Facebook angemeldet haben, werden sie hierher mit einem Autorisierungscode weitergeleitet, den Logto zur Fertigstellung der Authentifizierung verwendet.
  3. Navigiere zu Use cases und klicke auf Customize deines Anwendungsfalls, um die Berechtigungen (Scopes) hinzuzufügen. Wir empfehlen, email und public_profile hinzuzufügen, die für die Implementierung der Anmeldung mit Facebook in Logto erforderlich sind.

Schritt 2: Logto Connector mit Client-Zugangsdaten einrichten​

  1. Klicke im Facebook App Dashboard in der Seitenleiste auf App settings > Basic.
  2. Du siehst die App ID und das App secret im Panel.
  3. Klicke auf die Schaltfläche Show neben dem Eingabefeld für das App secret, um den Inhalt anzuzeigen und zu kopieren.
  4. Konfiguriere deine Logto Facebook Connector-Einstellungen:
    • Trage in das Feld clientId die App ID ein.
    • Trage in das Feld clientSecret das App secret ein.
    • Klicke in Logto auf Save and Done, um dein Identitätssystem mit Facebook zu verbinden.

Schritt 3: Berechtigungen (Scopes) konfigurieren​

Berechtigungen (Scopes) definieren, welche Zugriffsrechte deine App von den Benutzern anfordert und steuern, auf welche privaten Daten dein Projekt aus deren Facebook-Konten zugreifen kann.

Berechtigungen im Facebook App Dashboard konfigurieren​

  1. Navigiere zu Facebook App Dashboard > Use cases und klicke auf die Schaltfläche Customize.
  2. Füge nur die Berechtigungen hinzu, die deine App benötigt. Die Benutzer werden diese Berechtigungen auf dem Facebook Zustimmungsbildschirm (Consent screen) überprüfen und autorisieren:
    • Für Authentifizierung (erforderlich): email und public_profile.
    • Für API-Zugriff (optional): Alle zusätzlichen Berechtigungen, die deine App benötigt (z. B. threads_content_publish, threads_read_replies für den Zugriff auf die Threads API). Siehe die Meta Developer Documentation für verfügbare Dienste.

Berechtigungen in Logto konfigurieren​

Wähle je nach Bedarf eine oder mehrere der folgenden Vorgehensweisen:

Option 1: Keine zusätzlichen API-Berechtigungen benötigt

  • Lasse das Feld Scopes in deinem Logto Facebook Connector leer.
  • Die Standardberechtigungen email public_profile werden angefordert, damit Logto grundlegende Benutzerinformationen korrekt abrufen kann.

Option 2: Zusätzliche Berechtigungen bei der Anmeldung anfordern

  • Gib alle gewünschten Berechtigungen im Feld Scopes ein, getrennt durch Leerzeichen.
  • Alle hier aufgeführten Berechtigungen überschreiben die Standardwerte, daher immer auch die Authentifizierungsberechtigungen email public_profile angeben.

Option 3: Spätere Anforderung zusätzlicher Berechtigungen

  • Nachdem sich der Benutzer angemeldet hat, kannst du bei Bedarf zusätzliche Berechtigungen anfordern, indem du einen föderierten sozialen Autorisierungsfluss erneut startest und das gespeicherte Token-Set des Benutzers aktualisierst.
  • Diese zusätzlichen Berechtigungen müssen nicht im Feld Scopes deines Logto Facebook Connectors eingetragen werden und können über die Logto Social Verification API erreicht werden.

Wenn du diese Schritte befolgst, fordert dein Logto Facebook Connector genau die Berechtigungen an, die deine App benötigt – nicht mehr und nicht weniger.

tipp:

Wenn deine App diese Berechtigungen anfordert, um auf die Facebook API zuzugreifen und Aktionen auszuführen, aktiviere Store tokens for persistent API access im Logto Facebook Connector. Siehe den nächsten Abschnitt für Details.

Schritt 4: Allgemeine Einstellungen​

Hier sind einige allgemeine Einstellungen, die die Verbindung zu Facebook nicht blockieren, aber die Authentifizierungserfahrung für Endbenutzer beeinflussen können.

Profilinformationen synchronisieren​

Im Facebook Connector kannst du die Richtlinie für die Synchronisierung von Profilinformationen wie Benutzernamen und Avataren festlegen. Wähle aus:

  • Nur bei Registrierung synchronisieren: Profilinformationen werden einmalig beim ersten Anmelden des Benutzers abgerufen.
  • Immer bei Anmeldung synchronisieren: Profilinformationen werden bei jeder Anmeldung des Benutzers aktualisiert.

Tokens speichern, um auf Facebook APIs zuzugreifen (optional)​

Wenn du auf Facebook APIs zugreifen und Aktionen mit Benutzerautorisierung durchführen möchtest (egal ob über soziale Anmeldung oder Kontoverknüpfung), muss Logto bestimmte API-Berechtigungen erhalten und Tokens speichern.

  1. Füge die erforderlichen Berechtigungen gemäß obigem Tutorial hinzu.
  2. Aktiviere Store tokens for persistent API access im Logto Facebook Connector. Logto speichert Facebook Zugangstokens sicher im Secret Vault.
hinweis:

Facebook stellt keine Auffrischungstokens (Refresh tokens) bereit. Wenn jedoch die Token-Speicherung aktiviert ist, fordert Logto bei der Benutzer-Authentifizierung automatisch ein langlebiges Zugangstoken (60 Tage) an. Während dieses Zeitraums können Benutzer Zugangstokens manuell widerrufen, müssen aber ansonsten keine erneute Autorisierung durchführen, um auf Facebook APIs zuzugreifen. Hinweis: Füge offline_access nicht zum Feld Scope hinzu, da dies zu Fehlern führen kann.

Schritt 5: Anmeldung mit Facebook-Testbenutzern testen (optional)​

Du kannst Test-, Entwickler- und Administratorkonten verwenden, um die Anmeldung mit der App zu testen. Du kannst die App auch direkt veröffentlichen, sodass sich jeder Facebook-Benutzer anmelden kann.

  1. Klicke im Facebook App Dashboard in der Seitenleiste auf App roles > Test Users.
  2. Klicke auf die Schaltfläche Create test users, um einen Testbenutzer zu erstellen.
  3. Klicke auf die Schaltfläche Options eines bestehenden Testbenutzers, um weitere Aktionen wie „Name und Passwort ändern“ anzuzeigen.

Schritt 6: Facebook-Anmeldeeinstellungen veröffentlichen​

In der Regel können sich nur Test-, Administrator- und Entwicklerbenutzer mit der App anmelden. Um normalen Facebook-Benutzern die Anmeldung mit der App in der Produktionsumgebung zu ermöglichen, musst du die App möglicherweise veröffentlichen.

  1. Klicke im Facebook App Dashboard in der Seitenleiste auf Publish.
  2. Fülle die Felder Privacy Policy URL und User data deletion aus, falls erforderlich.
  3. Klicke auf die Schaltfläche Save changes unten rechts.
  4. Klicke auf die Live-Umschaltschaltfläche in der oberen Leiste der App.

Den Facebook Connector nutzen​

Sobald du einen Facebook Connector erstellt und mit Facebook verbunden hast, kannst du ihn in deine Endnutzer-Flows einbinden. Wähle die Optionen, die zu deinen Anforderungen passen:

„Mit Facebook anmelden“ aktivieren​

  1. Gehe in der Logto Console zu Anmeldeerfahrung > Registrierung und Anmeldung
  2. Füge den Facebook Connector im Abschnitt Soziale Anmeldung hinzu, damit sich Benutzer mit Facebook authentifizieren können

Erfahre mehr über die soziale Anmeldeerfahrung.

Nutze die Account API, um ein individuelles Account Center in deiner App zu erstellen, das angemeldeten Benutzern ermöglicht, ihr Facebook-Konto zu verknüpfen oder zu trennen. Folge dem Account API Tutorial

tipp:

Es ist möglich, den Facebook Connector nur für die Kontoverknüpfung und den API-Zugriff zu aktivieren, ohne ihn für die soziale Anmeldung zu aktivieren.

Auf die Facebook API zugreifen und Aktionen durchführen​

Deine Anwendung kann gespeicherte Facebook Zugangstokens (Access tokens) aus dem Secret Vault abrufen, um Facebook APIs aufzurufen und Backend-Aufgaben zu automatisieren (zum Beispiel Inhalte veröffentlichen oder Beiträge verwalten). Siehe die Anleitung zum Abrufen gespeicherter Tokens für den API-Zugriff.

Die Facebook-Identität eines Benutzers verwalten​

Nachdem ein Benutzer sein Facebook-Konto verknüpft hat, können Administratoren diese Verbindung in der Logto Console verwalten:

  1. Navigiere zu Benutzerverwaltung und öffne das Benutzerprofil.
  2. Unter Soziale Verbindungen finde den Facebook-Eintrag und klicke auf Verwalten.
  3. Auf dieser Seite können Administratoren die Facebook-Verbindung des Benutzers verwalten, alle gewährten und von Facebook synchronisierten Profilinformationen einsehen und den Status des Zugangstokens (Access token) überprüfen.
hinweis:

Die Access token-Antwort von Facebook enthält keine spezifischen Scope-Informationen, daher kann Logto die vom Benutzer gewährten Berechtigungen nicht direkt anzeigen. Solange der Benutzer jedoch den angeforderten Berechtigungen (Scopes) während der Autorisierung zugestimmt hat, verfügt deine Anwendung beim Zugriff auf die Facebook API über die entsprechenden Berechtigungen. Es wird empfohlen, die erforderlichen Berechtigungen sowohl in der Facebook Developer Console als auch in Logto korrekt zu konfigurieren, um sicherzustellen, dass deine App den notwendigen Zugriff hat.

Referenz​

Facebook for Developers – Dokumentation Facebook Login Dokumentation