Usa la API de JavaScript

Si lo prefieres, puedes usar solo código JavaScript para activar el mensaje de One Tap o renderizar el botón Acceder con Google.

Para configurar el mensaje de One Tap en JavaScript, primero debes llamar al método initialize(). Luego, llama al método prompt() para mostrar la IU de la instrucción. Consulta el siguiente fragmento de código:

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

Para recibir notificaciones de estado de la IU inmediatas, proporciona una función de devolución de llamada al método prompt(). Consulta el siguiente fragmento de código:

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

En el siguiente ejemplo de código, se muestra cómo renderizar One Tap y el botón Acceder con Google en 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>