Soziale Anmeldung mit Google einrichten

Der Google-Connector bietet eine prägnante Möglichkeit für deine Anwendung, das OAuth 2.0-Authentifizierungssystem von Google zu nutzen.

tipp

In diesem Leitfaden gehen wir davon aus, dass du grundlegende Kenntnisse über Logto Connectors hast. Falls nicht, schaue dir den Leitfaden Connectors konfigurieren an, um loszulegen.

Ein Projekt in der Google API Console einrichten

• Besuche die Google API Console und melde dich mit deinem Google-Konto an.
• Klicke auf die Schaltfläche Projekt auswählen in der oberen Menüleiste und klicke auf die Schaltfläche Neues Projekt, um ein Projekt zu erstellen.
• In deinem neu erstellten Projekt klicke auf APIs & Dienste, um das Menü APIs & Dienste aufzurufen.

Deinen Zustimmungsbildschirm konfigurieren

Deine Anwendung konfigurieren und registrieren

• Klicke im linken Menü APIs & Dienste auf die Schaltfläche OAuth-Zustimmungsbildschirm.
• Wähle den gewünschten Benutzertyp aus und klicke auf die Schaltfläche Erstellen. (Hinweis: Wenn du Extern als deinen Benutzertyp auswählst, musst du später Testbenutzer hinzufügen.)

Nun befindest du dich auf der Seite App-Registrierung bearbeiten.

App-Registrierung bearbeiten

OAuth-Zustimmungsbildschirm konfigurieren

• Folge den Anweisungen, um das Formular OAuth-Zustimmungsbildschirm auszufüllen.
• Klicke auf SPEICHERN UND FORTFAHREN, um fortzufahren.

Berechtigungen konfigurieren

• Klicke auf BERECHTIGUNGEN HINZUFÜGEN ODER ENTFERNEN und wähle ../auth/userinfo.email, ../auth/userinfo.profile und openid im Popup-Drawer aus und klicke auf AKTUALISIEREN, um abzuschließen. Es wird empfohlen, alle Berechtigungen hinzuzufügen, die du möglicherweise verwenden möchtest, da sonst einige Berechtigungen, die du in der Konfiguration hinzugefügt hast, möglicherweise nicht funktionieren.
• Fülle das Formular nach Bedarf aus.
• Klicke auf SPEICHERN UND FORTFAHREN, um fortzufahren.

Testbenutzer hinzufügen (nur externer Benutzertyp)

• Klicke auf BENUTZER HINZUFÜGEN und füge Testbenutzer hinzu, um diesen Benutzern den Zugriff auf deine Anwendung während des Testens zu ermöglichen.
• Klicke auf SPEICHERN UND FORTFAHREN, um fortzufahren.

Nun solltest du den Google OAuth 2.0-Zustimmungsbildschirm konfiguriert haben.

OAuth 2.0-Anmeldedaten erhalten

• Klicke im linken Menü APIs & Dienste auf die Schaltfläche Anmeldedaten.
• Auf der Seite Anmeldedaten klicke auf die Schaltfläche + ANMELDEDATEN ERSTELLEN in der oberen Menüleiste und wähle OAuth-Client-ID aus.
• Auf der Seite OAuth-Client-ID erstellen wähle Webanwendung als Anwendungstyp aus.
• Fülle die grundlegenden Informationen für deine Anwendung aus.
• Klicke auf + URI hinzufügen, um eine autorisierte Domain zu den Autorisierte JavaScript-Ursprünge hinzuzufügen. Dies ist die Domain, von der deine Logto-Autorisierungsseite bereitgestellt wird. In unserem Fall wird dies ${your_logto_origin} sein, z. B. https://logto.dev.
• Klicke auf + URI hinzufügen im Abschnitt **Autorisierte Weiterleitungs-URIs**, um die **Autorisierte Weiterleitungs-URIs** einzurichten, die den Benutzer nach der Anmeldung zur Anwendung weiterleiten. In unserem Fall wird dies ${your_logto_endpoint}/callback/${connector_id} sein, z. B. https://logto.dev/callback/${connector_id}. Die connector_id kann in der oberen Leiste der Logto Admin Console Connector-Detailseite gefunden werden.
• Klicke auf Erstellen, um abzuschließen, und dann erhältst du die Client-ID und das Client-Geheimnis.

Deinen Connector konfigurieren

Fülle die Felder clientId und clientSecret mit der Client-ID und dem Client-Geheimnis aus, die du von den OAuth-App-Detailseiten im vorherigen Abschnitt erhalten hast.

scope ist eine durch Leerzeichen getrennte Liste von Berechtigungen. Wenn nicht angegeben, ist der Standardwert für scope openid profile email.

Konfigurationstypen

Name	Typ
clientId	string
clientSecret	string
scope	string

Referenzen

• Google Identity: OAuth 2.0 einrichten