JavaScript API verwenden

Du kannst auch nur JavaScript-Code verwenden, um die One Tap-Eingabeaufforderung auszulösen oder die Schaltfläche „Über Google anmelden“ zu rendern.

Zum Konfigurieren der One Tap-Eingabeaufforderung in JavaScript müssen Sie zuerst die Methode initialize() aufrufen. Rufen Sie dann die Methode prompt() auf, um die UI für die Aufforderung anzuzeigen. Sehen Sie sich das folgende Code-Snippet an:

<script>
  window.onload = function () {
    google.accounts.id.initialize({
      client_id: 'YOUR_GOOGLE_CLIENT_ID',
      callback: handleCredentialResponse
    });
    google.accounts.id.prompt();
  }
</script>

Stellen Sie eine Callback-Funktion für die Methode prompt() bereit, um Benachrichtigungen zum Status der Benutzeroberfläche zu erhalten. Sehen Sie sich das folgende Code-Snippet an:

<script>
  window.onload = function () {
    google.accounts.id.initialize({
      client_id: 'YOUR_GOOGLE_CLIENT_ID',
      callback: handleCredentialResponse
    });
    google.accounts.id.prompt((notification) => {
        if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
            // try next provider if OneTap is not displayed or skipped
        }
    });
  }
</script>

Der folgende Beispielcode zeigt, wie sowohl One Tap als auch die Schaltfläche „Über Google anmelden“ in JavaScript gerendert werden.

<script>
  window.onload = function () {
    google.accounts.id.initialize({
      client_id: 'YOUR_GOOGLE_CLIENT_ID',
      callback: handleCredentialResponse
    });
    const parent = document.getElementById('google_btn');
    google.accounts.id.renderButton(parent, {theme: "filled_blue"});
    google.accounts.id.prompt();
  }
</script>