На этой странице описано, как реализовать функции, связанные с авторизацией и выходом пользователей из системы Google One Tap.
Автоматический вход пользователей
Google One Tap поддерживает автоматический вход в систему, что обеспечивает удобство использования (UX), исключая необходимость выполнения ручных действий при повторном посещении вашего сайта. Пользователям не нужно запоминать, какой аккаунт Google они выбрали во время последнего посещения, что снижает вероятность создания ненужных дублирующихся аккаунтов на вашей платформе.
Автоматический вход в систему призван дополнить нашу кнопку «Войти через Google» и диалоговые окна «Вход в одно касание». Он предназначен для использования на всем вашем сайте, а ручная регистрация или смена учетной записи будут происходить только после того, как пользователь впервые выйдет из системы.
Для автоматического входа в систему необходимо соблюдение следующих условий:
- Пользователи должны сначала войти в свою учетную запись Google, и
- ранее давшие согласие на передачу своего профиля учетной записи в ваше приложение, и
- При использовании FedCM за последние 10 минут была предпринята только одна попытка входа. При повторных попытках входа в течение этого периода отображается сообщение «One Tap».
- При использовании FedCM Chrome требует от пользователей повторного подтверждения входа на сайт с помощью учетной записи Google в каждом экземпляре Chrome, даже если пользователь одобрил вход на сайт до развертывания FedCM. Это изменение может повлиять на коэффициент конверсии на вашем существующем сайте, использующем One Tap. В обновлении Chrome M121 улучшение автоматического входа устраняет проблему падения коэффициента конверсии.
For pages where Automatic sign-in is enabled and if these conditions are met the user's ID token credential is automatically returned without any user interaction. If these conditions are not met, and even if Automatic sign-in is enabled on the page, the user defaults to the One Tap flow for sign-in or consent. If a user has multiple Google Accounts and visits your site they are required to first sign-in to a single Google Account and to have provided consent for that account.
Вы можете измерить процент успешных автоматических входов в систему, используя значение auto в поле select_by , возвращаемом объектом учетных данных.
Чтобы включить автоматический вход в систему, добавьте в свой код строку data-auto_select="true" , как показано в следующем фрагменте:
<div id="g_id_onload"
data-client_id="YOUR_GOOGLE_CLIENT_ID"
data-login_uri="https://your.domain/your_login_endpoint"
data-auto_select="true">
</div>
выход
Когда пользователь выходит из вашей учетной записи на сайте, его можно перенаправить на страницу, где автоматически отображается запрос Google One Tap. В этом случае автоматический выбор должен быть запрещен. В противном случае пользователь автоматически войдет в систему снова, что приведет к замкнутому кругу в пользовательском интерфейсе.
Использование FedCM
Для улучшения пользовательского опыта между каждой попыткой автоматического входа в систему предусмотрен 10-минутный перерыв. В течение этого времени вместо автоматического входа отображается запрос «В одно касание». Пользователям необходимо явно нажать кнопку «В одно касание», чтобы войти в систему.
Без FedCM
Чтобы запретить автоматический выбор после выхода пользователя из системы, добавьте имя класса g_id_signout ко всем ссылкам и кнопкам выхода. См. следующий фрагмент кода:
<div class="g_id_signout">Sign Out</div>
Следующий фрагмент кода JavaScript также можно использовать для выхода из системы:
const button = document.getElementById('signout_button');
button.onclick = () => {
google.accounts.id.disableAutoSelect();
}
To prevent a dead-loop UX, user signed-out status is stored in a cookie named g_state that is set by the Google Identity Services library. By default the cookie domain is set to the domain of current page. If One Tap is displayed on the parent domain and subdomains, the state cookie must be visible across all of your domains. Use the data-state_cookie_domain attribute to set the g_state cookie domain to your parent domain. For example, add data-state_cookie_domain="example.com" to the g_id_onload element for a parent domain of example.com and a subdomain named webapp.example.com .
Если у вас есть сервис, который отслеживает все используемые в вашем домене файлы cookie, вам необходимо уведомить его о файле cookie g_state .
Если вы не хотите загружать клиентскую библиотеку на страницах после входа в систему, используйте следующие решения, чтобы предотвратить зацикливание пользовательского интерфейса после выхода из системы:
- При выходе из системы перенаправьте пользователей на страницу (например,
https://example.com/logged_out), где функция автоматического входа в систему не отображается или где автоматический вход всегда отключен. - При выходе из системы добавьте параметр к URL-адресу. Например,
logged_out=1. При отображении One Tap с помощью JavaScript API проверьте этот параметр URL-адреса и отключите автоматический вход в систему, если он присутствует.
Ключевые сценарии взаимодействия пользователя с системой
Страница автоматического входа в систему.
Использование FedCM
Пользователи могут закрыть всплывающее окно One Tap, нажав кнопку X. В целях обеспечения доступности, даже если пользователи нажимают кнопку X , на ваш веб-сайт передается токен ID.
Для улучшения пользовательского опыта между каждой попыткой автоматического входа в систему предусмотрен 10-минутный перерыв. В течение этого времени вместо автоматического входа отображается запрос «В одно касание». Пользователям необходимо явно нажать кнопку «В одно касание», чтобы войти в систему.
Без FedCM
Если пользователи не нажмут кнопку «Отмена» в течение 5 секунд, токен идентификации будет передан на ваш веб-сайт.
При отмене входа в систему, в зависимости от количества активных сессий Google, отображается либо страница выбора учетной записи, либо страница повторного входа пользователя.
- Несколько сессий Google
- Отдельные сессии Google
