Используйте API JavaScript

При желании вы можете использовать только код JavaScript для запуска запроса One Tap или отображения кнопки «Войти через Google».

Чтобы настроить приглашение One Tap в JavaScript, сначала необходимо вызвать метод initialize() . Затем вызовите метод prompt() чтобы отобразить пользовательский интерфейс подсказки. См. следующий фрагмент кода:

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

Чтобы получать быстрые уведомления о состоянии пользовательского интерфейса, предоставьте функцию обратного вызова для метода prompt() . См. следующий фрагмент кода:

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

В приведенном ниже примере кода показано, как отображать кнопку One Tap и кнопку «Войти через Google» в 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>