Korzystanie z interfejsu JavaScript API

Jeśli chcesz, możesz użyć tylko kodu JavaScript, aby aktywować jednokrotne kliknięcie lub wyrenderować przycisk Zaloguj się przez Google.

Aby skonfigurować w JavaScript skrypt One Tap, najpierw musisz wywołać metodę initialize(). Następnie wywołaj metodę prompt(), by wyświetlić interfejs. Zobacz ten fragment kodu:

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

Aby otrzymywać powiadomienia o stanie interfejsu użytkownika monitu, udostępnij funkcję wywołania zwrotnego dla metody prompt(). Zobacz ten fragment kodu:

<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>

Przykład poniżej pokazuje, jak renderować strony z użyciem One Tap i przycisku Zaloguj się przez Google w JavaScript.

<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>