Hinweise zur Integration

Diese detaillierte Anleitung hilft dir, Entscheidungen zu allen wichtigen Integrationsproblemen zu treffen.

„Über Google anmelden“ in der Zusammenfassung

Im Folgenden finden Sie die allgemeinen Schritte für die Anmeldung bzw. Registrierung auf Ihrer Website.

1. Nutzer melden sich auf einer Google-Website an.

   Damit „Über Google anmelden“ funktioniert, muss im Browser eine aktive Google-Sitzung aktiv sein. One Tap und automatische Anmeldung werden nur ausgelöst, wenn sich Nutzer vor dem Laden deiner Webseiten in Google angemeldet haben. Dieser Schritt ist für den Schaltflächenablauf „Über Google anmelden“ optional, da Nutzer aufgefordert werden, sich bei Google anzumelden, wenn sie auf die Schaltfläche klicken.

2. Nutzer besuchen Ihre Webseiten, auf denen die Schaltflächen „One Tap“, „Automatische Anmeldung“ oder „Über Google anmelden“ eingebettet sind.

3. Nutzer interagieren mit One Tap, der Schaltfläche „Über Google anmelden“ und weiteren UX-Abläufen, um:

   • Wählen Sie eine aktive Google-Sitzung aus, um fortzufahren.
   • Holen Sie die Einwilligung der Endnutzer für die Freigabe von Profilinformationen für Ihre Website ein, falls Sie dem noch nicht zugestimmt haben.

   Befinden sich im Browser nur eine aktive Google-Sitzung,

   • Mit One Tap wird automatisch die einzige Sitzung ausgewählt und die Seite zur Kontoauswahl wird übersprungen.
   • Die Schaltfläche „Über Google anmelden“ bleibt auf der Seite für die Kontoauswahl, über die Nutzer bei Bedarf eine neue Google-Sitzung hinzufügen können.

   Wenn das ausgewählte Google-Konto zuvor noch nicht mit Ihrer Website verwendet wurde oder die Berechtigung widerrufen wurde, wird eine Einwilligungsseite angezeigt.

   

   Nach der Genehmigung speichert Google die Entscheidung, sodass die Einwilligungsseite beim nächsten Mal übersprungen werden kann.

4. JSON Web Tokens (auch ID-Token genannt), die den Namen, die E-Mail-Adresse und das Profilbild des Nutzers enthalten, werden entweder über einen JavaScript-Callback-Handler oder nach der Übermittlung an Ihren Back-End-Dienst freigegeben.

   Wenn Sie ID-Tokens an den JavaScript-Callback-Handler auf Clientseite zurückgeben möchten, müssen Sie sie nicht im JavaScript-Code decodieren, sondern auf Ihre eigene Weise an Ihren Server senden. Ein gutes Beispiel ist die Verwendung von XmlHttpRequest, um das durch das Senden des Beitrags verursachte Neuladen der Seite zu vermeiden.

5. Auf deiner Serverseite werden die von Google ausgestellten JWT-Anmeldedaten validiert und verwendet, um ein neues Konto zu erstellen oder eine authentifizierte Sitzung auf deiner Website einzurichten.

   Sie verwalten den Anmeldestatus der Nutzer auf Ihrer eigenen Website.

   Der Anmeldestatus des Google-Kontos des Nutzers und Ihre Anwendung sind unabhängig voneinander, außer während der Anmeldung selbst, wenn Sie wissen, dass der Nutzer erfolgreich authentifiziert wurde und in seinem Google-Konto angemeldet ist. Nutzer können angemeldet bleiben, sich abmelden oder zu einem anderen Google-Konto wechseln, während sie eine aktive Sitzung auf Ihrer Website beibehalten.

Zusammenfassend lässt sich sagen, dass „Über Google anmelden“, ähnlich wie die passwortbasierte Anmeldung, eine weitere Möglichkeit zur Authentifizierung von Nutzern im Web bietet. „Über Google anmelden“ bietet nach der Authentifizierung keine Funktionen für die Sitzungsverwaltung auf Ihrer Website.

Auf Google APIs und Google-Dienste zugreifen

Sie haben die Authentication API wie oben beschrieben integriert. Es kann sein, dass Sie auch die Authorization API einbinden müssen, wenn Ihre Website im Namen authentifizierter Nutzer auf Google APIs und Google-Dienste zugreifen muss. Während bei der Authentifizierung Ihre Website ID-Tokens zum Authentifizieren von Nutzern bereitstellt, erhält Ihre Website bei der Autorisierung separate Zugriffstokens und Berechtigungen zur Verwendung von Google APIs und Google-Diensten. Weitere Informationen finden Sie unter Für das Web autorisieren.

UX-Trennung für Authentifizierung und Autorisierung

Wenn Ihre Website sowohl Authentifizierungs- als auch Autorisierungs-APIs aufrufen muss, müssen Sie diese zu unterschiedlichen Zeitpunkten separat aufrufen. Siehe Authentifizierungs- und Autorisierungsmoment trennen.

Wenn deine Website in der Vergangenheit Authentifizierungs- und Autorisierungstokens zusammen angefordert hat, musst du bei Verwendung der Google Identity Services JavaScript-Bibliothek deine UX so anpassen, dass der Authentifizierungs- und der Autorisierungsmoment getrennt werden.

• Zum Zeitpunkt der Authentifizierung kann Ihre Website über die Schaltfläche „One Tap“, „Automatische Anmeldung“ oder „Über Google anmelden“ eingebunden werden, damit sich Nutzer bei Ihrer Website anmelden oder registrieren können.
• Im Moment der Autorisierung kann Ihre Website die Autorisierungs-API aufrufen, um die Berechtigungen und Tokens für den Zugriff auf Google APIs oder Google-Dienste abzurufen.

Für einen reibungslosen Übergang und eine Reduzierung der Komplexität ist es üblich, den Prozess in zwei getrennte Schritte zu unterteilen.

1. Refaktorieren Sie die UX, um Authentifizierungs- und Autorisierungsmomente voneinander zu trennen.

2. Migrieren Sie zur JavaScript-Bibliothek von Google Identity Services.

HTML API und JavaScript API im Vergleich

Du kannst entweder die HTML API oder die JavaScript API verwenden, um One Tap, die automatische Anmeldung oder die Schaltfläche „Über Google anmelden“ in deine Webseiten zu integrieren.

Die HTML API bietet mehr integrierte Funktionen. Beispiel:

• Darstellung von One Tap oder der Schaltfläche „Über Google anmelden“ beim Seitenaufbau.
• Sende die zurückgegebenen Anmeldedaten an den serverseitigen Endpunkt, der durch das Attribut data-login_uri angegeben ist, nachdem One Tap, die automatische Anmeldung oder das Pop-up oder die Weiterleitung über eine Schaltfläche ausgeführt wurde.
• Verhindern Sie CSRF-Angriffe durch double-submit-cookie.
• Generieren Sie den HTML-Code mit dem Codegenerator und kopieren Sie ihn einfach in Ihre HTML-Seiten.

Mit der HTML API können Sie auch JavaScript-Code schreiben, um das Verhalten anzupassen.

• Sie können Ihren eigenen Callback-Handler schreiben und dann den Funktionsnamen auf das Attribut data-callback festlegen. Ein gutes Beispiel ist die Verwendung einer XmlHttpRequest-Anforderung, um die zurückgegebenen Anmeldedaten an Ihren Server zu senden, um zu vermeiden, dass die Seite aufgrund der Standardübermittlung nach dem Senden neu geladen wird.

Mit der JavaScript API haben Sie bei einigen Szenarien mehr Flexibilität.

• Später werden One Tap und die Schaltfläche „Über Google anmelden“ gerendert. Das ist beispielsweise der Fall, wenn Nutzer Login aus dem Menü auswählen.
• Mehrmaliges Aufrufen der API Beispielsweise muss die Schaltfläche „Über Google anmelden“ jedes Mal gerendert werden, wenn der Anmeldedialog gerendert wird.
• Ihre HTML-Seiten dynamisch generieren, sodass es schwierig ist, API-Aufrufcode in diese einzubetten
• Die JavaScript-Bibliothek von Google Identity Services wird viel später geladen.

Der HTML API-Code kann nur einmal beim Onload-Ereignis der Seite oder beim Onload-Ereignis der Google Identity Services JavaScript-Bibliothek aufgerufen werden, je nachdem, was später eintritt. Sie sollten die JavaScript API verwenden, wenn das HTML API-Verhalten nicht Ihren Erwartungen entspricht.

Verwende die HTML API nicht mit der JavaScript API auf derselben Webseite, um die Seite zu initialisieren oder um One Tap und Schaltflächen-Rendering zu verwenden. Überprüfen Sie Ihren HTML- und JavaScript-Code auf Stellen, an denen Überschneidungen auftreten können. Wichtige Hinweise:

• Sie verwenden die HTML API, wenn mindestens eines der Elemente in <div id='g_id_onload' ... ><id> oder <div class='g_id_signin' ...></div> in Ihrem HTML-Code vorhanden ist.
• Sie verwenden die JavaScript API, wenn eine oder mehrere der Methoden in initialize(), prompt() oder render() in Ihrem JavaScript-Code aufgerufen werden, unabhängig davon, ob sie inline eingefügt oder aus einer separaten JavaScript-Datei geladen werden.

Die folgenden JavaScript APIs können unabhängig von der Initialisierung oder dem Rendern durch One Tap und Schaltflächen verwendet werden. Sie haben keine entsprechenden HTML APIs:

• revoke
• cancel
• disableAutoSelect
• storeCredential

Hinweise zur Schaltfläche „Über Google anmelden“

Pop-up und Weiterleitung im Vergleich

Die OAuth 2.0-Spezifikation berücksichtigt die HTTP-Weiterleitung, enthält aber keine Anleitung zum Rendern von Pop-up-Dialogfeldern. Die Pop-up-UX, insbesondere auf Websites für Computer, kann Endnutzern eine bessere Nutzererfahrung bieten. Das liegt daran, dass Nutzer nicht von Seiten von Drittanbietern weitergeleitet werden. Außerdem bietet ein dialogorientiertes Pop-up-Fenster kontextbezogene Informationen zum Gewähren von Berechtigungen.

Im Pop-up-Fenster muss der Identitätsanbieter auf clientseitigen ursprungsübergreifenden Kommunikationskanälen aufbauen, um OAuth-Antworten vom Pop-up-Fenster, in dem die Einwilligungsseite des Identitätsanbieters angezeigt wird, an das Hauptfenster zu übergeben, in dem die Drittanbieterseite angezeigt wird. Normalerweise sind JavaScript-Codes auf beiden Seiten erforderlich, um die OAuth-Antwort über Fenster hinweg zu senden und zu empfangen.

Die Schaltfläche „Über Google anmelden“ unterstützt sowohl das Pop-up als auch die Weiterleitung. Standardmäßig wird das UX-Pop-up verwendet. Sie können die UX ändern, indem Sie das Attribut data-ux_mode festlegen.

Es gibt einige Unterschiede zwischen dem Weiterleitungsvorgang für die Schaltfläche „Über Google anmelden“ und dem OAuth-Weiterleitungsvorgang.

• Der Weiterleitungsvorgang für die Schaltfläche „Über Google anmelden“ verwendet immer die Methode POST, um die Anmeldedaten an Ihren Webserver zu senden. Bei der OAuth-Weiterleitung wird normalerweise die Methode GET verwendet.
• Die Parameter, die durch den Weiterleitungsvorgang für die Schaltfläche „Über Google anmelden“ gesendet werden, unterscheiden sich von denen des OAuth-Weiterleitungsvorgangs.

Für Entwickler, die die HTML API verwenden, werden die Anmeldedaten immer mit der Methode POST und den gleichen Parametern an die data-login_uri gesendet, unabhängig davon, welche UX verwendet wird. Auf diese Weise können Sie den UX-Modus ohne weitere Änderungen am Code wechseln. Für die Weiterleitungs-UX muss data-login_uri den autorisierten Weiterleitungs-URIs für den Client in der Google APIs-Konsole hinzugefügt werden.

Schaltflächen anpassen

Die Verwendung Ihrer eigenen Schaltfläche wird nicht unterstützt. Es gibt keine API, um einen Schaltflächenfluss programmatisch zu initiieren.

Um den Ablauf für „Über Google anmelden“ zu aktivieren, musst du nur eine oder mehrere „Über Google anmelden“-Schaltflächen auf deinen Webseiten rendern. Der Ablauf der Schaltflächen wird transparent initiiert und gehandhabt, wenn Nutzer auf diese Schaltflächen klicken.

Mit der Button Rendering API kannst du das Design der Schaltfläche „Über Google anmelden“ anpassen. Wir empfehlen, Schaltflächen mit dem Codegenerator interaktiv zu gestalten. Auch wenn Sie die JavaScript API verwenden, können Sie zuerst den HTML-Code generieren und dann in die entsprechenden Felder in der JavaScript API kopieren.

Es gibt keine API, mit der Websites steuern können, ob die personalisierten Informationen zum Rendern der Schaltflächen verwendet werden sollen. Die personalisierten Schaltflächen werden angezeigt, wenn alle Bedingungen erfüllt sind. Weitere Informationen finden Sie unter Informationen zu personalisierten Schaltflächen.

Sie können mehrere Schaltflächen auf derselben Webseite platzieren. Der Codegenerator kann jeweils nur eine Schaltfläche erstellen. Sie können ihn mehrmals ausführen und den generierten <div class='g_id_signin' ...></div>-Code in die Webseite kopieren.

Best Practices für das Rendern von Schaltflächen

Aus Datenschutzgründen wird die personalisierte Schaltfläche in einem iFrame der Domain accounts.google.com angezeigt. Das Laden eines iFrames kann in einem langsamen Netzwerk zeitaufwendig sein. Um dieses Latenzproblem zu beheben, werden die Schaltflächen in zwei Schritten gerendert:

1. Eine Inline-Schaltflächenversion wird in der DOM-Struktur Ihrer Website gerendert. Es ist nur eine Textschaltfläche, die nicht personalisiert werden kann. Damit soll die Schaltfläche so schnell wie möglich für Nutzende sichtbar sein.
2. Eine iFrame-Anfrage wird an Google gesendet, um den iFrame der Schaltfläche zu laden, der möglicherweise personalisierte Informationen enthält. Sobald der iFrame der Schaltfläche geladen ist, wird die Inline-Versionsschaltfläche entfernt.

Im Folgenden findest du einige Best Practices zum Minimieren der Latenz, wenn die Schaltfläche „Über Google anmelden“ eingeblendet wird.

• Laden Sie die JavaScript-Bibliothek von Google Identity Services so früh wie möglich. Du kannst die JavaScript-Bibliothek vor anderen großen Bibliotheken laden, insbesondere im mobilen Web.

• Die Schaltfläche „Über Google anmelden“ wird erst gerendert, nachdem der Nutzer Login aus dem Menü ausgewählt hat. Du kannst die Schaltfläche „Über Google anmelden“ zuerst in einem ausgeblendeten Element rendern. Anschließend kannst du sie sichtbar machen, wenn der Nutzer Anmelden aus dem Menü auswählt.

Hinweise zu One Tap

Automatische Anmeldung

Die stornierbare automatische Anmeldung bietet die folgenden Vorteile.

• Die Anmelderate kann dadurch verbessert werden, wenn eine Nutzeraktion gespeichert wird.
• Anders als bei der stillen Anmeldung, die aus der zuvor eingestellten JavaScript-Bibliothek für Google Log-in stammt, sehen Nutzer bei der automatischen Anmeldung immer eine Benutzeroberfläche. So erfahren sie, warum und wie sie auf Ihrer Website angemeldet sind. Nutzer haben auch die Möglichkeit, das Abo auf Wunsch zu kündigen.
• Es wird automatisch das Konto ausgewählt, das der Nutzer zuvor verwendet hat. Dadurch wird möglicherweise verhindert, dass der Nutzer doppelte Konten auf Ihrer Website erstellt.

Ob Sie die automatische Anmeldung aktivieren, ist eine Entscheidung, die Sie anhand der UX- und Geschäftsanforderungen Ihrer Website treffen müssen. Besonders wenn die meisten Abmeldungen von Ihrer Website durch eine Zeitüberschreitung der Sitzung und nicht durch explizite Nutzerauswahl verursacht werden, kann die automatische Anmeldung eine gute Möglichkeit für Ihre Nutzer sein, den Sitzungsstatus wiederherzustellen.

Wann die One Tap-Benutzeroberfläche angezeigt werden soll

Mit der HTML API wird One Tap beim Seitenaufbau immer angezeigt. Mit der JavaScript API kannst du festlegen, wann die One Tap-Benutzeroberfläche angezeigt wird. Hinweis: Die One Tap-UI wird aus verschiedenen unten beschriebenen Gründen möglicherweise nicht immer angezeigt, nachdem die API aufgerufen wurde.

• Keine aktive Google-Sitzung im Browser.
• Alle aktiven Google-Sitzungen sind deaktiviert.
• Cooldown läuft.

Versuchen Sie nicht, bei einem Schaltflächenklick nur die One Tap-Benutzeroberfläche anzuzeigen. Die One Tap-Benutzeroberfläche wird möglicherweise aus den oben genannten Gründen nicht angezeigt und Nutzer haben möglicherweise eine fehlerhafte UX, da nach der Nutzeraktion nichts angezeigt wird. Bei einem Schaltflächen-Click-Event:

Empfohlen

• Blende das Anmeldedialogfeld mit Passwortanmeldung und die Schaltfläche „Über Google anmelden“ ein und rufe gleichzeitig die One Tap API auf. So wird sichergestellt, dass Nutzern immer eine bestimmte Anmeldemethode für Ihre Website angeboten wird.

Nicht empfohlen

• Wenn Sie nur One Tap anbieten, kann es bei der Anmeldung zu Problemen bei der Anmeldung kommen, wenn One Tap nicht angezeigt wird.
• Einen UI-Status-Callback verwenden, um eine andere UI anzuzeigen, wenn One Tap nicht angezeigt wird Dies wird nicht empfohlen, da der UI-Status-Callback in einer zukünftigen Version möglicherweise nicht gut mit der Verwaltung föderierter Anmeldedaten funktioniert.

One Tap in ITP-Browsern

Aufgrund von Intelligent Tracking Prevention (ITP) funktioniert die normale One Tap-UX nicht in ITP-Browsern wie Chrome unter iOS, Safari und Firefox. In diesen Browsern wird stattdessen eine andere UX angezeigt, die mit einer Begrüßungsseite beginnt.

Die One Tap-UX in ITP-Browsern kann bei Bedarf deaktiviert werden. Weitere Informationen finden Sie unter One Tap-Unterstützung in ITP-Browsern.

In Nicht-ITP-Browsern wie Chrome unter Android/macOS/Linux und Edge kann diese UX nicht aktiviert werden.

Aufforderung abbrechen, wenn der Nutzer weg klickt

Standardmäßig wird die One Tap-Aufforderung automatisch geschlossen, wenn der Nutzer auf eine Stelle außerhalb der Aufforderung klickt. Dieses Verhalten können Sie bei Bedarf ändern.

Es wird empfohlen, die One Tap-Aufforderung in der Website für Computer geöffnet zu lassen, da der Bildschirm groß genug ist.

Position der One Tap-UX ändern

Auf Websites für Computer können Sie die Position der One Tap-Aufforderung ändern. Diese Funktion wird jedoch nicht empfohlen, da sie in einer zukünftigen Version nicht von der Verwaltung föderierter Anmeldedaten unterstützt wird.

Anmeldekontext ändern

One Tap sollte Teil eines größeren UX-Flows auf Ihrer Website sein. Standardmäßig wird die One Tap-Benutzeroberfläche im Anmeldekontext verwendet. Die Sprache der Benutzeroberfläche enthält bestimmte Formulierungen, z. B. „Anmelden“. Sie können das Context-Attribut ändern, um einen anderen Satz von Formulierungen zu erstellen. Sie können einen der One Tap-Header auswählen, der am besten zu Ihrem UX-Ablauf passt.

Über One Tap-UI-Status anhören

Zur nahtlosen Integration in deinen größeren UX-Ablauf kann One Tap Benachrichtigungen erhalten, wenn sich der UI-Status ändert. In zukünftigen Releases für die Föderierte Anmeldedatenverwaltung wird diese Funktion jedoch nicht mehr unterstützt.

One Tap über mehrere Subdomains hinweg

Standardmäßig werden die Abkühlphase von One Tap und andere Status pro Ursprung erfasst. Wird One Tap auf Ihrer Website in mehreren Subdomains angezeigt, müssen Sie dies in Ihrem API-Code angeben.

One Tap in statischen HTML-Seiten

Standardmäßig geht die GIS-Bibliothek davon aus, dass Ihre Webseiten dynamisch generiert werden. Ihr HTTP-Server prüft beim Generieren des HTML-Codes den Anmeldestatus des Nutzers.

• Wenn kein Nutzer angemeldet ist, sollte der One Tap-HTML-Code in die Ergebnisseite eingefügt werden, damit One Tap ausgelöst wird, damit sich Nutzer auf Ihrer Website anmelden können.
• Wenn Nutzer bereits angemeldet sind, sollte der One Tap-HTML-Code nicht auf der angezeigten Seite angezeigt werden.

In diesem Fall ist Ihr Webserver dafür verantwortlich, den One Tap HTML API-Code hinzuzufügen oder zu entfernen.

One Tap HTML API-Code kann auch auf andere Weise funktionieren, da er für Websites entwickelt wurde, auf denen viele statische HTML-Inhalte gehostet werden. Sie können den One Tap HTML API-Code jederzeit in Ihre statischen HTML-Seiten einfügen und den Namen des Sitzungscookies angeben, der auf Ihrer Website verwendet wird.

• Wenn das Sitzungscookie nicht vorhanden ist, wird der One Tap-Ablauf ausgelöst.
• Wenn das Sitzungscookie vorhanden ist, wird der One Tap-Ablauf übersprungen.

In diesem Fall hängt es vom Status Ihres Sitzungscookies ab, ob der One Tap-Ablauf ausgelöst wird, und nicht durch das Vorhandensein des One Tap HTML API-Codes auf Ihrer Webseite.

Serverseitige Integration

Nachdem One Tap die automatische Anmeldung oder der UX-Vorgang für die Schaltfläche „Über Google anmelden“ abgeschlossen ist, wird ein ID-Token ausgestellt und mit deiner Website geteilt. Zur Authentifizierung des Nutzers sind einige serverseitige Änderungen erforderlich, um das ID-Token zu empfangen und zu validieren.

UX-Überlegungen

Normalerweise müssen Sie einen HTTP-Endpunkt in Ihrem eigenen Ursprung hinzufügen, um die Antworten auf Ihrer Serverseite zu verarbeiten. Die folgenden Faktoren können sich auf die resultierende UX auswirken.

• Ob „One Tap“ oder „Über Google anmelden“ ausgelöst wird.
• Ob die HTML-API oder die JavaScript-API verwendet wird.
• Gibt an, ob der Anmelde-URI oder die JavaScript-Callback-Funktion zur Verarbeitung der Antwort verwendet wird.

Die tatsächliche UX, die Sie erhalten, wird unten beschrieben.

1. Für die Weiterleitung im UX-Modus der Schaltfläche „Über Google anmelden“:

   • Unabhängig davon, ob die HTML API oder die JavaScript API verwendet wird, müssen Sie den Anmelde-URI festlegen. Es ist unmöglich, eine JavaScript-Callback-Funktion zur Verarbeitung der Antwort zu verwenden, da Nutzer bereits von deiner Webseite weitergeleitet wurden.
   • Zusammenfassung der Nutzererfahrung: Nach dem Klicken auf die Schaltfläche „Über Google anmelden“ sehen Nutzer eine ganzseitige Weiterleitung zu einer Google-Benutzeroberfläche, auf der sie die Sitzung auswählen und genehmigen können. Anschließend wird ein ganzseitiges POST an den von Ihnen angegebenen Anmelde-URI gesendet.

2. Im UX-Modus für One Tap oder „Über Google anmelden“, wenn die JavaScript API oder die HTML API und eine JavaScript-Callback-Funktion verwendet werden:

   • Die Auth-Antworten werden an die JavaScript-Callback-Funktion zurückgegeben.
   • UX-Zusammenfassung: Die One Tap-Aufforderung oder ein Pop-up-Fenster wird über Ihrer Webseite angezeigt. Nachdem der Nutzer die Benutzeroberfläche in der Aufforderung oder dem Pop-up-Fenster für die Auswahl und Genehmigung von Sitzungen abgeschlossen hat, erhält die JavaScript-Callback-Funktion die Antworten. Die nachfolgende UX hängt davon ab, wie die Callback-Funktion die Antworten an den Server sendet.

3. Andernfalls (HTML-API mit der Groß-/Kleinschreibung der Anmelde-URI):

   • Die Antworten für die Authentifizierung werden an den Anmelde-URI gesendet.
   • UX-Zusammenfassung: Der One Tap-Aufforderung oder ein Pop-up-Fenster wird über Ihrer Webseite angezeigt. Nachdem Nutzer die Benutzeroberfläche im Prompt oder im Pop-up-Fenster für die Auswahl und Genehmigung von Sitzungen abgeschlossen haben, werden die Antworten zur Authentifizierung in Form einer ganzseitigen POST-Übermittlung an die von Ihnen angegebene Anmelde-URL gesendet.

Es wird empfohlen, die Antworten für One Tap und die Schaltfläche „Über Google anmelden“ einheitlich zu senden.

Sicherheitsaspekte

Um Cross-Site Request Forgery-Angriffe zu verhindern,

• Für das Senden nach dem Senden, das durch die JavaScript-Bibliothek des Google Identity Service-Clients ausgelöst wird, können Sie das integrierte Muster für das doppelte Senden von Cookies verwenden. Weitere Informationen findest du unter Google-ID-Token auf Serverseite prüfen.
• Für die Übermittlung an den eigenen Ursprung mithilfe einer XmlHttpRequest können Sie den benutzerdefinierten HTTP-Header oder andere von Ihrem Sicherheitsteam genehmigte Sicherheitsmaßnahmen verwenden.

Um die ID-Tokens in den Authentifizierungsantworten zu prüfen, wird dringend empfohlen, eine Google API-Clientbibliothek für deine Plattform oder eine allgemeine JWT-Bibliothek zu verwenden.

FAQ

• Sind die Schaltflächen „One Tap“ und „Über Google anmelden“ in WebView verfügbar?

  Nein. Aus Sicherheitsgründen sollten Nutzer keine Google-Sitzungen in WebViews hinzufügen. Daher sind GIS in WebViews deaktiviert, da keine Google-Sitzungen stattfinden sollen.

• Kann ich meine eigene „Über Google anmelden“-Schaltfläche verwenden? Nein. Mit dem OAuth-Server Side Flow oder der früheren Version der Google Log-in-JavaScript-Bibliothek konnten vertrauende Parteien anhand der Branding-Richtlinien für Anmeldungen ihre eigenen Versionen der Google Log-in-Schaltflächen erstellen.

  „Über Google anmelden“ hat diese Funktion jedoch entfernt. Alle „Über Google anmelden“-Schaltflächen müssen von der JavaScript-Bibliothek von Google Identity Services generiert werden. Für diese Änderung gibt es zwei Gründe.

  • Einige vertrauende Parteien haben die Richtlinien nicht befolgt, was zu uneinheitlichen „Über Google anmelden“-Schaltflächen auf Websites führt.
  • Wenn du die Inhalte von der Bibliothek erstellst, musst du keine Änderungen vornehmen, wenn sich die Branding-Richtlinien für Anmeldungen ändern.

  Um diese Regel zu erzwingen, stellt die JavaScript-Bibliothek nur eine API zum Rendern einer Schaltfläche bereit, nicht aber die API zum Starten des Anmeldevorgangs.

• Was ist, wenn auf meiner Website nur One Tap, aber nicht die Schaltfläche „Über Google anmelden“ aktiviert ist?

  Wir empfehlen, sowohl One Tap als auch die Schaltfläche „Über Google anmelden“ auf Ihrer Website zu verwenden. Aufgrund der exponentiellen Abkühlphase wird One Tap möglicherweise nicht jedes Mal angezeigt. Wenn Nutzer sich wirklich mit ihrem Google-Konto auf Ihrer Website anmelden möchten, können sie das Hauptdialogfeld für die Anmeldung aufrufen und sich dort mit der Schaltfläche „Über Google anmelden“ anmelden. Nach einer erfolgreichen Anmeldung über die Schaltfläche „Über Google anmelden“ wird der Cool-down-Status von One Tap gelöscht, sodass One Tap bei der nächsten Anmeldung angezeigt werden kann. Andere Schaltflächenflüsse von Google können den Cooldown-Status von One Tap nicht löschen, da sie sich in verschiedenen JavaScript-Binärdateien befinden.

  Wenn auf Ihrer Website nur One Tap aktiviert ist, die Schaltfläche „Über Google anmelden“ jedoch nicht aktiviert ist, kann es zu Leistungseinbußen bei One Tap kommen, da die exponentiellen Wartezeiten nicht rechtzeitig gelöscht werden.

• Wann wird mein HTML-API-Code geparst? Kann ich meinen HTML API-Code später ändern?

  Die JavaScript-Bibliothek von Google Identity Services parst und führt den HTML API-Code aus, entweder beim Laden der JavaScript-Bibliothek oder beim DomContentLoaded-Ereignis, je nachdem, welches Ereignis später eintritt.

  • Wenn das DomContentLoaded-Ereignis beim Laden der JavaScript-Bibliothek ausgelöst wird, wird Ihr HTML API-Code sofort geparst und ausgeführt.
  • Andernfalls fügt die JavaScript-Bibliothek einen Listener für das Ereignis „DomContentLoaded“ hinzu. Bei Auslösung parst der Listener Ihren HTML-API-Code und führt ihn aus.

  Beachten Sie auch, dass das Parsen und die Ausführung Ihres HTML API-Codes einmalig erfolgt.

  • Nach dem Parsen und der Ausführung werden alle nachfolgenden Änderungen am HTML API-Code ignoriert.
  • Es gibt keine API für Entwickler, um den Parsing- oder Ausführungsprozess auszulösen.