Einrichtung

Bevor Sie „Über Google anmelden“, „One Tap“ oder die automatische Anmeldung auf Ihrer Website hinzufügen, müssen Sie Ihre OAuth-Konfiguration und optional die Inhaltssicherheitsrichtlinie Ihrer Website einrichten.

Google API-Client-ID abrufen

Wenn Sie „Über Google anmelden“ auf Ihrer Website aktivieren möchten, müssen Sie zuerst Ihre Google API-Client-ID einrichten. Führen Sie dazu folgende Schritte aus:

1. Öffnen Sie die des .
2. Erstellen oder wählen Sie ein -Projekt aus. Wenn Sie bereits ein Projekt für die Schaltfläche „Über Google anmelden“ oder Google One Tap haben, verwenden Sie das vorhandene Projekt und die Webclient-ID. Wenn Sie Produktionsanwendungen erstellen, sind möglicherweise mehrere Projekte erforderlich. Wiederholen Sie die restlichen Schritte in diesem Abschnitt für jedes Projekt, das Sie verwalten.
3. Klicken Sie auf Client erstellen und wählen Sie für Anwendungstyp die Option Webanwendung aus, um eine neue Client-ID zu erstellen. Wenn Sie eine vorhandene Client-ID verwenden möchten, wählen Sie den Typ Webanwendung aus.

4. Fügen Sie den URI Ihrer Website zu Autorisierte JavaScript-Quellen hinzu. Der URI enthält nur das Schema und den vollständig qualifizierten Hostnamen. Beispiel: https://www.example.com

5. Optional können Anmeldedaten auch über eine Weiterleitung an einen von Ihnen gehosteten Endpunkt statt über einen JavaScript-Callback zurückgegeben werden. Fügen Sie in diesem Fall Ihre Weiterleitungs-URIs unter Autorisierte Weiterleitungs-URIs hinzu. Weiterleitungs-URIs enthalten das Schema, den voll qualifizierten Hostnamen und den Pfad und müssen den Gültigkeitsregeln für Weiterleitungs-URIs entsprechen. Beispiel: https://www.example.com/auth-receiver.

OAuth-Zustimmungsbildschirm konfigurieren

Sowohl die Anmeldung über Google als auch die One-Tap-Authentifizierung umfassen einen Einwilligungsbildschirm, auf dem Nutzer darüber informiert werden, welche Anwendung Zugriff auf ihre Daten anfordert, welche Art von Daten angefordert werden und welche Nutzungsbedingungen gelten.

1. Öffne die im Bereich „Google Auth Platform“ der.
2. Wählen Sie bei Aufforderung das Projekt aus, das Sie gerade erstellt haben.

3. Füllen Sie auf der Seite das Formular aus und klicken Sie auf die Schaltfläche „Speichern“.

   1. Name der Anwendung:Der Name der Anwendung, für die die Einwilligung eingeholt wird. Der Name sollte Ihre App genau widerspiegeln und mit dem Namen der App übereinstimmen, den Nutzer an anderer Stelle sehen.

   2. App-Logo:Dieses Bild wird auf dem Einwilligungsbildschirm angezeigt, damit Nutzer Ihre App erkennen. Das Logo wird auf dem Einwilligungsbildschirm für die Anmeldung über Google und in den Kontoeinstellungen angezeigt, aber nicht im One-Tap-Dialogfeld.

   3. Support-E-Mail-Adresse:Wird auf dem Zustimmungsbildschirm für den Nutzersupport und für G Suite-Administratoren angezeigt, die den Zugriff auf Ihre Anwendung für ihre Nutzer prüfen. Diese E-Mail-Adresse wird Nutzern auf dem Einwilligungsbildschirm für die Anmeldung über Google angezeigt, wenn sie auf den Namen der Anwendung klicken.

   4. Autorisierte Domains:Um Sie und Ihre Nutzer zu schützen, erlaubt Google die Nutzung autorisierter Domains nur solchen Anwendungen, die OAuth verwenden. Die Links Ihrer Apps müssen auf autorisierten Domains gehostet werden. Weitere Informationen

   5. Link zur Startseite der App:Wird auf dem Einwilligungsbildschirm für „Über Google anmelden“ und unter der Schaltfläche „Weiter als“ mit einem DSGVO-konformen Haftungsausschluss angezeigt. Muss auf einer autorisierten Domain gehostet werden.

   6. Link zur Datenschutzerklärung der Anwendung:Wird auf dem Einwilligungsbildschirm für die Anmeldung über Google angezeigt. Außerdem muss unter der Schaltfläche „Als [Name] fortfahren“ ein DSGVO-konformer Haftungsausschluss für die One-Tap-Funktion enthalten sein. Muss auf einer autorisierten Domain gehostet werden.

   7. Link zu den Nutzungsbedingungen der App (optional): Wird auf dem Bildschirm zur Einwilligung bei der Anmeldung über Google und unter der Schaltfläche „Als [Name] fortfahren“ angezeigt. Muss auf einer autorisierten Domain gehostet werden.

4. Rufen Sie auf, um Bereiche für Ihre App zu konfigurieren.

   1. Bereiche für Google APIs: Mit Bereichen kann Ihre Anwendung auf die privaten Daten Ihrer Nutzer zugreifen. Für die Authentifizierung ist der Standardumfang (E-Mail, Profil, OpenID) ausreichend. Sie müssen keine vertraulichen Bereiche hinzufügen. Im Allgemeinen wird empfohlen, Zugriffsbereiche schrittweise anzufordern, wenn der Zugriff erforderlich ist, und nicht im Voraus.

5. Prüfen Sie den „Überprüfungsstatus“. Wenn Ihre Anwendung bestätigt werden muss, klicken Sie auf die Schaltfläche „Zur Überprüfung einreichen“, um sie einzureichen. Weitere Informationen finden Sie unter Anforderungen an die OAuth-Bestätigung.

OAuth-Einstellungen bei der Anmeldung anzeigen

Abbildung 1. OAuth-Zustimmungseinstellungen, die von One Tap in Chrome angezeigt werden

Content Security Policy

Eine Content Security Policy ist zwar optional, wird aber empfohlen, um Ihre App zu schützen und Cross-Site-Scripting-Angriffe (XSS) zu verhindern. Weitere Informationen finden Sie unter Einführung in CSP und CSP und XSS.

Ihre Content-Sicherheitsrichtlinie kann eine oder mehrere Anweisungen enthalten, z. B. connect-src, frame-src, script-src, style-src oder default-src.

Wenn Ihr CSP Folgendes enthält:

• connect-src-Richtlinie https://accounts.google.com/gsi/ hinzufügen, damit eine Seite die übergeordnete URL für serverseitige Endpunkte von Google Identity Services laden kann.
• frame-src-Richtlinie hinzufügen, um die übergeordnete URL der iFrames der Schaltflächen „One Tap“ und „Über Google anmelden“ zuzulassen.https://accounts.google.com/gsi/
• script-src-Richtlinie https://accounts.google.com/gsi/client hinzu, um die URL der JavaScript-Bibliothek von Google Identity Services zuzulassen.
• style-src-Richtlinie hinzufügen, um die URL der Stylesheets der Google Identity Services zuzulassen.https://accounts.google.com/gsi/style
• Die Anweisung default-src dient als Fallback, wenn eine der vorherigen Anweisungen (connect-src, frame-src, script-src oder style-src) nicht angegeben ist. Fügen Sie https://accounts.google.com/gsi/ hinzu, damit eine Seite die übergeordnete URL für serverseitige Endpunkte der Google Identity Services laden kann.

Geben Sie bei der Verwendung von connect-src keine einzelnen GIS-URLs an. So lassen sich Fehler beim Aktualisieren des GIS minimieren. Verwenden Sie beispielsweise anstelle von https://accounts.google.com/gsi/status die übergeordnete GIS-URL https://accounts.google.com/gsi/.

Mit diesem Beispiel für einen Antwortheader können Google Identity Services erfolgreich geladen und ausgeführt werden:

Content-Security-Policy-Report-Only: script-src
https://accounts.google.com/gsi/client; frame-src
https://accounts.google.com/gsi/; connect-src https://accounts.google.com/gsi/;

Cross-Origin-Opener-Richtlinie

Für die Schaltfläche „Über Google anmelden“ und Google One Tap sind möglicherweise Änderungen an deinem Cross-Origin-Opener-Policy (COOP) erforderlich, damit Pop-ups erstellt werden können.

Wenn FedCM aktiviert ist, werden Pop-ups direkt vom Browser gerendert und es sind keine Änderungen erforderlich.

Wenn FedCM jedoch deaktiviert ist, musst du den COOP-Header festlegen:

• an same-origin und
• enthalten same-origin-allow-popups.

Wenn Sie die richtige Überschrift nicht festlegen, wird die Kommunikation zwischen den Fenstern unterbrochen, was zu einem leeren Pop-up-Fenster oder ähnlichen Fehlern führt.