Jeśli wolisz, możesz użyć tylko kodu JavaScriptu, aby wywołać prompt One Tap lub wyświetlić przycisk Zaloguj się przez Google.
Aby skonfigurować prompt One Tap w JavaScript, musisz najpierw wywołać metodę initialize(). Następnie wywołaj metodę prompt(), aby wyświetlić prompt w interfejsie użytkownika. 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 promptu w interfejsie użytkownika, podaj funkcję wywołania zwrotnego metodzie 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ładowy kod poniżej pokazuje, jak renderować w JavaScript zarówno przycisk One Tap, jak i przycisk Zaloguj się za pomocą Google.
<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>