Automatische Anmeldung und Abmeldung

Auf dieser Seite wird beschrieben, wie Sie Funktionen implementieren, die sich auf das An- und Abmelden von Nutzern über Google One Tap beziehen.

Nutzer automatisch anmelden

Google One Tap unterstützt die automatische Anmeldung, was eine reibungslose Nutzererfahrung ermöglicht, da die manuellen Schritte entfallen, die Besucher ausführen müssen, wenn sie zu Ihrer Website zurückkehren. 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 soll unsere Schaltfläche „Über Google anmelden“ und die One Tap-Dialogfelder ergänzen. Sie wurde für die gesamte Website entwickelt. Die manuelle Registrierung oder der Kontowechsel erfolgt erst, nachdem sich der Nutzer von der Website abgemeldet hat.

Damit die automatische Anmeldung ausgeführt werden kann, sind die folgenden Bedingungen erforderlich:

  • Nutzer müssen sich zuerst in ihrem Google-Konto anmelden.
  • zuvor eingewilligt haben, dass ihr Kontoprofil für Ihre App freigegeben wird, und
  • Bei Verwendung von FedCM wurde in den letzten 10 Minuten nur ein einziger Anmeldeversuch unternommen. One Tap wird bei wiederholten Anmeldeversuchen in diesem Fenster angezeigt.
  • Bei Verwendung von FedCM müssen Nutzer in Chrome in jeder Chrome-Instanz neu bestätigen, dass sie sich mit ihrem Google-Konto auf der Website anmelden möchten, auch wenn der Nutzer die Website vor der FedCM-Einführung genehmigt hat. Diese Änderung kann sich auf die Conversion-Rate Ihrer bestehenden Website mit One Tap auswirken. Im Chrome M121-Update kann das Problem durch eine Verbesserung bei der automatischen Anmeldung behoben werden.

Für Seiten, auf denen die automatische Anmeldung aktiviert ist und diese Bedingungen erfüllt sind, werden die Anmeldedaten mit dem Besucher-ID-Token automatisch ohne Nutzerinteraktion zurückgegeben. Wenn diese Bedingungen nicht erfüllt sind und die automatische Anmeldung auf der Seite aktiviert ist, verwendet der Nutzer für die Anmeldung oder die Einwilligung standardmäßig den One Tap-Vorgang. Wenn ein Nutzer mehrere Google-Konten hat und Ihre Website besucht, muss er sich zuerst in einem einzigen Google-Konto anmelden und seine Einwilligung für dieses Konto erteilt haben.

Sie können die Erfolgsquote der automatischen Anmeldung am Wert auto im Feld select_by des zurückgegebenen Anmeldedatenobjekts messen.

Um die automatische Anmeldung zu aktivieren, 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 Google One Tap-Aufforderung angezeigt wird. Für diese Einrichtung muss die automatische Auswahl verboten sein. Andernfalls wird der Nutzer automatisch wieder angemeldet, was zu einer Dead-Loop-UX führt.

FedCM verwenden

Um die Nutzerfreundlichkeit zu verbessern, wird zwischen jedem automatischen Anmeldeversuch eine Pausierung von 10 Minuten vorgenommen. Während dieses Zeitraums wird stattdessen One Tap angezeigt.

Ohne FedCM

Wenn Sie die automatische Auswahl nach dem Abmelden eines Nutzers verhindern möchten, fügen Sie allen Abmeldelinks und -schaltflächen den Klassennamen g_id_signout hinzu. Sehen Sie sich das folgende Code-Snippet an:

<div class="g_id_signout">Sign Out</div>

Das folgende JavaScript-Code-Snippet kann auch für die Abmeldung verwendet werden:

const button = document.getElementById('signout_button');
button.onclick = () => {
  google.accounts.id.disableAutoSelect();
}

Der Status „Abmelden“ wird daher über ein Cookie in Ihrer Domain erfasst, um die Dead-Loop-UX zu vermeiden.

Der Abmeldestatus wird im Cookie g_state 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 mit den folgenden Lösungen eine Dead-Loop-UX nach der Abmeldung verhindern:

  • Leiten Sie Nutzer nach der Abmeldung auf eine Seite weiter (z. B. https://example.com/logged_out), auf der One Tap nicht angezeigt wird oder auf der die automatische Anmeldung immer deaktiviert ist.
  • Fügen Sie der URL nach der Abmeldung einen Parameter hinzu. Beispiel: logged_out=1. Prüfen Sie beim Rendern von One Tap by JavaScript API diesen URL-Parameter und deaktivieren Sie die automatische Anmeldung, falls vorhanden.

Wichtige Nutzererfahrungen

Die Seite für die automatische Anmeldung

FedCM verwenden

Pop-up für automatische Anmeldung in FedCM

Wenn Nutzer nicht innerhalb von 5 Sekunden auf X klicken, um den Vorgang abzubrechen, wird ein ID-Token mit Ihrer Website geteilt.

Ohne FedCM

Pop-up zur automatischen Anmeldung

Wenn Nutzer nicht innerhalb von 5 Sekunden auf Abbrechen klicken, wird ein ID-Token an Ihre Website weitergegeben.

Wenn die Anmeldung abgebrochen wird, wird basierend auf der Anzahl aktiver Google-Sitzungen entweder die Seite für die Kontoauswahl oder die Seite für wiederkehrende Nutzer angezeigt.

  • Mehrere Google-Sitzungen

    FedCM verwenden

    FedCM-Seite zur Kontoauswahl

    Ohne FedCM

    Seite „Kontoauswahl“

  • Einzelne Google-Sitzungen

    FedCM verwenden

    FedCM-Seite zur Kontoauswahl

    Ohne FedCM

    One Tap-Seite für wiederkehrende Nutzer