На этой странице описывается, как реализовать функции, связанные с тем, как пользователи входят в систему или выходят из нее с помощью Google One Tap.
Автоматический вход пользователей
Google One Tap поддерживает автоматический вход, что обеспечивает беспроблемный пользовательский опыт (UX), устраняя необходимость ручных действий, которые пользователи должны выполнять при возвращении на ваш сайт. Пользователям не нужно помнить, какой аккаунт Google они выбрали во время последнего посещения, что снижает вероятность создания ненужных дубликатов аккаунтов на вашей платформе.
Автоматический вход предназначен для дополнения кнопки «Войти через Google» и диалогов «Одно касание». Он предназначен для использования на всем вашем сайте, при этом ручная регистрация или переключение учетных записей происходит только после того, как пользователь впервые вышел с вашего сайта.
Для автоматического входа необходимы следующие условия:
- пользователи должны сначала войти в свою учетную запись Google, и
- ранее предоставили согласие на передачу профиля своей учетной записи в ваше приложение, и
- при использовании FedCM, сделал только одну попытку входа за последние 10 минут. One Tap отображается, когда в течение этого окна происходят повторные попытки входа.
- при использовании FedCM Chrome требует от пользователей повторного подтверждения того, что они хотят войти на сайт с помощью учетной записи Google в каждом экземпляре Chrome, даже если пользователь одобрил сайт до развертывания FedCM. Это изменение может повлиять на коэффициент конверсии на вашем существующем сайте с использованием One Tap. В обновлении Chrome M121 улучшение автоматического входа смягчает проблему падения коэффициента конверсии.
Для страниц, где включен автоматический вход, и если эти условия выполнены, учетные данные токена идентификатора пользователя автоматически возвращаются без какого-либо взаимодействия с пользователем. Если эти условия не выполнены, и даже если на странице включен автоматический вход, пользователь по умолчанию переходит к потоку One Tap для входа или согласия. Если у пользователя есть несколько учетных записей Google и он посещает ваш сайт, ему необходимо сначала войти в одну учетную запись Google и предоставить согласие для этой учетной записи.
Вы можете измерить показатель успешности автоматического входа, используя значение 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. Для этой настройки автоматический выбор должен быть запрещен. В противном случае пользователь автоматически войдет снова, что приведет к мертвой петле UX.
Использование FedCM
Для улучшения пользовательского опыта между каждой автоматической попыткой входа в систему есть 10-минутный тихий период. В течение этого периода времени вместо этого отображается запрос One Tap. Для входа в систему пользователям необходимо явно нажать One Tap.
Без 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();
}
Чтобы предотвратить зависание UX, статус выхода пользователя из системы сохраняется в файле cookie с именем g_state , который устанавливается библиотекой Google Identity Services. По умолчанию домен файла cookie устанавливается на домен текущей страницы. Если One Tap отображается на родительском домене и поддоменах, файл cookie состояния должен быть виден на всех ваших доменах. Используйте атрибут data-state_cookie_domain , чтобы задать домен файла cookie g_state на ваш родительский домен. Например, добавьте data-state_cookie_domain="example.com" к элементу g_id_onload для родительского домена example.com и поддомена с именем webapp.example.com .
Если у вас есть служба, которая отслеживает все файлы cookie, используемые в вашем домене, вам необходимо уведомить ее о файле cookie g_state .
Если вы не хотите загружать клиентскую библиотеку на страницах после входа в систему, воспользуйтесь этими решениями, чтобы предотвратить возникновение тупиковой ситуации в пользовательском опыте после выхода из системы:
- При выходе из системы перенаправляйте пользователей на страницу (например,
https://example.com/logged_out), где One Tap не отображается или где автоматический вход всегда отключен. - При выходе из системы добавьте параметр в URL. Например,
logged_out=1. При рендеринге One Tap by JavaScript API проверьте этот параметр URL и отключите автоматический вход, если он есть.
Основные пути пользователя
Страница автоматического входа.
Использование FedCM
Пользователи могут закрыть запрос One Tap, нажав кнопку X. В целях обеспечения доступности ваш веб-сайт получает идентификационный токен, даже если пользователи нажимают кнопку X.
Для улучшения пользовательского опыта между каждой автоматической попыткой входа в систему есть 10-минутный тихий период. В течение этого периода времени вместо этого отображается запрос One Tap. Для входа в систему пользователям необходимо явно нажать One Tap.
Без FedCM
Если пользователи не нажимают кнопку «Отмена» в течение 5 секунд, вашему веб-сайту передается идентификационный токен.
При отмене входа в систему в зависимости от количества активных сеансов Google отображается либо страница выбора учетной записи, либо страница возвращающегося пользователя.
- Несколько сеансов Google
- Отдельные сеансы Google
На этой странице описывается, как реализовать функции, связанные с тем, как пользователи входят в систему или выходят из нее с помощью Google One Tap.
Автоматический вход пользователей
Google One Tap поддерживает автоматический вход, что обеспечивает беспроблемный пользовательский опыт (UX), устраняя необходимость ручных действий, которые пользователи должны выполнять при возвращении на ваш сайт. Пользователям не нужно помнить, какой аккаунт Google они выбрали во время последнего посещения, что снижает вероятность создания ненужных дубликатов аккаунтов на вашей платформе.
Автоматический вход предназначен для дополнения кнопки «Войти через Google» и диалогов «Одно касание». Он предназначен для использования на всем вашем сайте, при этом ручная регистрация или переключение учетных записей происходит только после того, как пользователь впервые вышел с вашего сайта.
Для автоматического входа необходимы следующие условия:
- пользователи должны сначала войти в свою учетную запись Google, и
- ранее предоставили согласие на передачу профиля своей учетной записи в ваше приложение, и
- при использовании FedCM, сделал только одну попытку входа за последние 10 минут. One Tap отображается, когда в течение этого окна происходят повторные попытки входа.
- при использовании FedCM Chrome требует от пользователей повторного подтверждения того, что они хотят войти на сайт с помощью учетной записи Google в каждом экземпляре Chrome, даже если пользователь одобрил сайт до развертывания FedCM. Это изменение может повлиять на коэффициент конверсии на вашем существующем сайте с использованием One Tap. В обновлении Chrome M121 улучшение автоматического входа смягчает проблему падения коэффициента конверсии.
Для страниц, где включен автоматический вход, и если эти условия выполнены, учетные данные токена идентификатора пользователя автоматически возвращаются без какого-либо взаимодействия с пользователем. Если эти условия не выполнены, и даже если на странице включен автоматический вход, пользователь по умолчанию переходит к потоку One Tap для входа или согласия. Если у пользователя есть несколько учетных записей Google и он посещает ваш сайт, ему необходимо сначала войти в одну учетную запись Google и предоставить согласие для этой учетной записи.
Вы можете измерить показатель успешности автоматического входа, используя значение 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. Для этой настройки автоматический выбор должен быть запрещен. В противном случае пользователь автоматически войдет снова, что приведет к мертвой петле UX.
Использование FedCM
Для улучшения пользовательского опыта между каждой автоматической попыткой входа в систему есть 10-минутный тихий период. В течение этого периода времени вместо этого отображается запрос One Tap. Для входа в систему пользователям необходимо явно нажать One Tap.
Без 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();
}
Чтобы предотвратить зависание UX, статус выхода пользователя из системы сохраняется в файле cookie с именем g_state , который устанавливается библиотекой Google Identity Services. По умолчанию домен файла cookie устанавливается на домен текущей страницы. Если One Tap отображается на родительском домене и поддоменах, файл cookie состояния должен быть виден на всех ваших доменах. Используйте атрибут data-state_cookie_domain , чтобы задать домен файла cookie g_state на ваш родительский домен. Например, добавьте data-state_cookie_domain="example.com" к элементу g_id_onload для родительского домена example.com и поддомена с именем webapp.example.com .
Если у вас есть служба, которая отслеживает все файлы cookie, используемые в вашем домене, вам необходимо уведомить ее о файле cookie g_state .
Если вы не хотите загружать клиентскую библиотеку на страницах после входа в систему, воспользуйтесь этими решениями, чтобы предотвратить возникновение тупиковой ситуации в пользовательском опыте после выхода из системы:
- При выходе из системы перенаправляйте пользователей на страницу (например,
https://example.com/logged_out), где One Tap не отображается или где автоматический вход всегда отключен. - При выходе из системы добавьте параметр в URL. Например,
logged_out=1. При рендеринге One Tap by JavaScript API проверьте этот параметр URL и отключите автоматический вход, если он есть.
Основные пути пользователя
Страница автоматического входа.
Использование FedCM
Пользователи могут закрыть запрос One Tap, нажав кнопку X. В целях обеспечения доступности ваш веб-сайт получает идентификационный токен, даже если пользователи нажимают кнопку X.
Для улучшения пользовательского опыта между каждой автоматической попыткой входа в систему есть 10-минутный тихий период. В течение этого периода времени вместо этого отображается запрос One Tap. Для входа в систему пользователям необходимо явно нажать One Tap.
Без FedCM
Если пользователи не нажимают кнопку «Отмена» в течение 5 секунд, вашему веб-сайту передается идентификационный токен.
При отмене входа в систему в зависимости от количества активных сеансов Google отображается либо страница выбора учетной записи, либо страница возвращающегося пользователя.
- Несколько сеансов Google
- Отдельные сеансы Google