Cette page explique comment implémenter des fonctionnalités liées à la connexion ou à la déconnexion des utilisateurs avec Google One Tap.
Connecter les utilisateurs automatiquement
Google One Tap est compatible avec la connexion automatique, qui offre une expérience utilisateur fluide en supprimant les étapes manuelles que les visiteurs doivent effectuer pour revenir sur votre site. Les utilisateurs n'ont pas besoin de se souvenir du compte Google qu'ils ont sélectionné lors de leur dernière visite, ce qui réduit le risque de création de comptes en double inutiles sur votre plate-forme.
La connexion automatique vise à compléter le bouton "Se connecter avec Google" et les boîtes de dialogue One Tap. Il est conçu pour être utilisé sur l'ensemble de votre site. L'inscription manuelle ou le changement de compte ne s'effectue qu'une fois que l'utilisateur s'est déconnecté de votre site.
Pour que la connexion automatique se produise, les conditions suivantes sont requises:
- les utilisateurs doivent d'abord être connectés à leur compte Google.
- vous avez déjà autorisé à partager le profil de leur compte avec votre application ; et
- lors de l'utilisation de FedCM, n'ont effectué qu'une seule tentative de connexion au cours des 10 dernières minutes. One Tap s'affiche lorsque des tentatives de connexion répétées se produisent pendant cette période.
- lorsqu'ils utilisent FedCM, Chrome demande aux utilisateurs de confirmer à nouveau qu'ils souhaitent se connecter au site Web avec un compte Google dans chaque instance Chrome, même si l'utilisateur a approuvé le site Web avant le déploiement de FedCM. Ce changement peut avoir un impact sur le taux de conversion sur votre site existant qui utilise One Tap. Dans la mise à jour de Chrome M121, l'amélioration de la connexion automatique atténue le problème de baisse du taux de conversion.
Pour les pages où la connexion automatique est activée et si ces conditions sont remplies, l'identifiant du jeton d'ID de visiteur est automatiquement renvoyé sans aucune interaction de l'utilisateur. Si ces conditions ne sont pas remplies et que la connexion automatique est activée sur la page, l'utilisateur utilise par défaut le flux One Tap pour la connexion ou le consentement. Si un utilisateur possède plusieurs comptes Google et consulte votre site, il doit d'abord se connecter à un seul compte Google et avoir donné son autorisation pour ce compte.
Vous pouvez mesurer le taux de réussite de la connexion automatique à l'aide de la valeur auto du champ select_by de l'objet d'identification renvoyé.
Pour activer la connexion automatique, ajoutez data-auto_select="true" à votre code, comme indiqué dans l'extrait suivant:
<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>
Se déconnecter
Lorsqu'un utilisateur se déconnecte de votre site Web, il peut être redirigé vers une page sur laquelle une invite Google One Tap s'affiche automatiquement. Pour cette configuration, la sélection automatique doit être interdite. Sinon, l'utilisateur est automatiquement connecté à nouveau, ce qui entraîne une expérience utilisateur en boucle morte.
Utiliser FedCM
Pour améliorer l'expérience utilisateur, une période silencieuse de 10 minutes s'applique entre chaque tentative de connexion automatique. Pendant cette période, One Tap s'affiche à la place.
Sans FedCM
Pour interdire la sélection automatique une fois l'utilisateur déconnecté, ajoutez le nom de classe g_id_signout à tous vos liens et boutons de déconnexion. Consultez l'extrait de code suivant:
<div class="g_id_signout">Sign Out</div>
Vous pouvez également utiliser l'extrait de code JavaScript suivant pour vous déconnecter:
const button = document.getElementById('signout_button');
button.onclick = () => {
google.accounts.id.disableAutoSelect();
}
Par conséquent, l'état de déconnexion est enregistré via un cookie de votre domaine afin d'éviter toute expérience utilisateur en boucle morte.
L'état de déconnexion est stocké dans le cookie g_state de votre domaine. Si vous disposez d'un service qui surveille tous les cookies utilisés dans votre domaine, vous devez l'informer de ce cookie.
Si vous ne souhaitez pas charger la bibliothèque cliente sur vos pages post-connexion, utilisez les solutions suivantes pour éviter une expérience utilisateur en boucle morte après la déconnexion:
- Une fois la déconnexion effectuée, redirigez les utilisateurs vers une page (par exemple,
https://example.com/logged_out) sur laquelle One Tap n'est pas affiché ou sur laquelle la connexion automatique est toujours désactivée. - Lorsque vous vous déconnectez, ajoutez un paramètre à l'URL. Par exemple,
logged_out=1. Lors de l'affichage de l'API One Tap by JavaScript, vérifiez ce paramètre d'URL et désactivez la connexion automatique si elle est présente.
Principaux parcours utilisateur
Page de connexion automatique
Utiliser FedCM
Si les utilisateurs ne cliquent pas sur X pour annuler dans les cinq secondes, un jeton d'ID est partagé avec votre site Web.
Sans FedCM
Si les utilisateurs ne cliquent pas sur le bouton Annuler dans les cinq secondes, un jeton d'ID est partagé avec votre site Web.
Lorsque la connexion est annulée, en fonction du nombre de sessions Google actives, la page du sélecteur de compte ou la page de l'utilisateur connu s'affichent.
Plusieurs sessions Google
Utiliser FedCM
Sans FedCM
Sessions Google uniques
Utiliser FedCM
Sans FedCM
