Auf dieser Seite wird beschrieben, wie Sie Funktionen für die An- und Abmeldung von Nutzern mit Google One Tap implementieren.
Nutzer automatisch anmelden
Google One Tap unterstützt die automatische Anmeldung, die eine reibungslose Nutzung ermöglicht, da die manuellen Schritte wegfallen, die Nutzer bei der Rückkehr zu Ihrer Website ausführen müssen. Nutzer müssen sich nicht merken, welches Google-Konto sie bei ihrem letzten Besuch ausgewählt haben. Dadurch wird die Wahrscheinlichkeit verringert, dass unnötige doppelte Konten auf Ihrer Plattform erstellt werden.
Die automatische Anmeldung ist als Ergänzung für die Schaltfläche „Über Google anmelden“ und „One Tap“ gedacht. Sie ist für die Verwendung auf Ihrer gesamten Website konzipiert. Die manuelle Registrierung oder der Kontowechsel erfolgt erst, nachdem sich der Nutzer erstmals von Ihrer Website abgemeldet hat.
Damit die automatische Anmeldung erfolgen kann, müssen folgende Bedingungen erfüllt sein:
- müssen die Nutzer in ihrem Google-Konto angemeldet sein.
- zuvor ihre Einwilligung zur Weitergabe ihres Kontoprofils mit Ihrer App erteilt haben und
- bei Verwendung von FedCM in den letzten 10 Minuten nur eine einzige Anmeldung durchgeführt. One Tap wird angezeigt, wenn in diesem Fenster wiederholt Anmeldeversuche stattfinden.
- Wenn Sie FedCM verwenden, müssen Nutzer in Chrome in jeder Chrome-Instanz noch einmal bestätigen, dass sie sich mit ihrem Google-Konto auf der Website anmelden möchten, auch wenn der Nutzer die Website vor dem FedCM-Roll-out genehmigt hat. Diese Änderung kann sich auf die Conversion-Rate Ihrer bestehenden Website mit One Tap auswirken. Im Chrome M121-Update wird durch die Verbesserung der automatischen Anmeldung das Problem mit dem Rückgang der Conversion-Rate verringert.
Für Seiten, auf denen die automatische Anmeldung aktiviert ist und diese Bedingungen erfüllt sind, werden die ID-Token-Anmeldedaten des Nutzers automatisch ohne Nutzerinteraktion zurückgegeben. Wenn diese Bedingungen nicht erfüllt sind und die automatische Anmeldung auf der Seite aktiviert ist, verwendet der Nutzer standardmäßig den One Tap-Ablauf für die Anmeldung oder Einwilligung. Wenn ein Nutzer mehrere Google-Konten hat und deine Website besucht, muss er sich zuerst in einem einzelnen Google-Konto anmelden und seine Einwilligung für dieses Konto geben.
Sie können die Erfolgsquote der automatischen Anmeldung mithilfe des Werts auto im Feld select_by des zurückgegebenen Anmeldedatenobjekts messen.
Zur Aktivierung der automatischen Anmeldung fügen Sie Ihrem Code data-auto_select="true" hinzu, wie im folgenden Snippet gezeigt:
<div id="g_id_onload"
data-client_id="YOUR_GOOGLE_CLIENT_ID"
data-login_uri="https://your.domain/your_login_endpoint"
data-auto_select="true">
</div>
Abmelden
Wenn sich ein Nutzer von deiner Website abmeldet, kann er auf eine Seite weitergeleitet werden, auf der automatisch eine Aufforderung von Google One Tap angezeigt wird. In diesem Fall muss die automatische Auswahl unzulässig sein. Andernfalls wird der Nutzer automatisch wieder angemeldet, was zu einer Dead-Loop-UX führt.
FedCM verwenden
Zur Verbesserung der Nutzerfreundlichkeit sollte zwischen jedem automatischen Anmeldeversuch eine Pausierung von 10 Minuten eingeplant werden. Während dieser Zeit wird stattdessen die One Tap-Aufforderung angezeigt. Nutzer müssen explizit auf One Tap klicken, um sich anzumelden.
Ohne FedCM
Wenn Sie die automatische Auswahl nach der Abmeldung eines Nutzers verhindern möchten, fügen Sie allen Abmeldelinks und -schaltflächen den Klassennamen g_id_signout hinzu. Hier ein Code-Snippet:
<div class="g_id_signout">Sign Out</div>
Sie können auch das folgende JavaScript-Code-Snippet verwenden, um sich abzumelden:
const button = document.getElementById('signout_button');
button.onclick = () => {
google.accounts.id.disableAutoSelect();
}
Folglich wird der Status „Abgemeldet“ über ein Cookie in Ihrer Domain aufgezeichnet, um eine Dead-Loop-UX zu vermeiden.
Der Abmeldestatus wird im g_state-Cookie in Ihrer Domain gespeichert. Wenn Sie einen Dienst haben, der alle in Ihrer Domain verwendeten Cookies überwacht, müssen Sie ihn über dieses Cookie informieren.
Wenn Sie die Clientbibliothek nicht auf Ihren Seiten nach der Anmeldung laden möchten, können Sie diese Lösungen verwenden, um eine Dead-Loop-UX nach der Abmeldung zu vermeiden:
- Leiten Sie Nutzer beim Abmelden auf eine Seite weiter, z. B.
https://example.com/logged_out, auf der One Tap nicht angezeigt oder die automatische Anmeldung immer deaktiviert ist. - Wenn Sie sich abmelden, fügen Sie der URL einen Parameter hinzu. Beispiel:
logged_out=1. Prüfen Sie beim Rendern der One Tap by JavaScript API den URL-Parameter und deaktivieren Sie gegebenenfalls die automatische Anmeldung.
Wichtige Nutzererfahrungen
Die Seite für die automatische Anmeldeseite.
FedCM verwenden
Nutzer können die One Tap-Aufforderung schließen, indem sie auf die Schaltfläche X klicken. Aus Gründen der Barrierefreiheit wird ein ID-Token für Ihre Website freigegeben, auch wenn Nutzer auf die Schaltfläche X klicken.
Zur Verbesserung der Nutzerfreundlichkeit sollte zwischen jedem automatischen Anmeldeversuch eine Pausierung von 10 Minuten eingeplant werden. Während dieser Zeit wird stattdessen die One Tap-Aufforderung angezeigt. Nutzer müssen explizit auf One Tap klicken, um sich anzumelden.
Ohne FedCM
Wenn Nutzer nicht innerhalb von fünf Sekunden auf die Schaltfläche Abbrechen klicken, wird ein ID-Token für Ihre Website freigegeben.
Wenn die Anmeldung abgebrochen wird, wird basierend auf der Anzahl der aktiven Google-Sitzungen entweder die Seite für die Kontoauswahl oder die Seite für wiederkehrende Nutzer angezeigt.
- Mehrere Google-Sitzungen
- Einzelne Google-Sitzungen
