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>