Documentation de référence de l'API HTML Se connecter avec Google

Cette page de référence décrit l'API des attributs de données HTML Se connecter avec Google. Vous pouvez utiliser l'API pour afficher l'invite One Tap ou le bouton "Se connecter avec Google" sur vos pages Web.

Élément portant l'ID "g_id_onload"

Vous pouvez placer les attributs de données Se connecter avec Google dans n'importe quel élément visible ou invisible, comme <div> et <span>. La seule condition requise est que l'ID de l'élément soit défini sur g_id_onload. Ne le placez pas sur plusieurs éléments.

Attributs de données

Le tableau suivant répertorie les attributs de données et leur description:

Attribut
data-client_id ID client de votre application
data-auto_prompt Appuyez sur l'écran pour afficher Google One.
data-auto_select Active la sélection automatique sur Google One Tap.
data-login_uri URL de votre point de terminaison de connexion
data-callback Nom de la fonction du gestionnaire de jetons d'ID JavaScript
data-native_login_uri URL du point de terminaison de votre gestionnaire d'identifiants de mots de passe
data-native_callback Nom de la fonction du gestionnaire d'identifiants de mot de passe JavaScript
data-native_id_param Nom du paramètre de la valeur credential.id
data-native_password_param Nom du paramètre de la valeur credential.password
data-cancel_on_tap_outside Détermine si l'invite doit être annulée si l'utilisateur clique en dehors de l'invite.
data-prompt_parent_id ID DOM de l'élément de conteneur de l'invite One Tap.
data-skip_prompt_cookie Ignore One Tap si la valeur du cookie spécifié n'est pas vide.
data-nonce Une chaîne aléatoire pour les jetons d'ID
data-context le titre et les mots affichés dans l'invite One Tap.
data-moment_callback Nom de la fonction de l'écouteur de notifications d'état de l'UI de requête
data-state_cookie_domain Si vous devez appeler One Tap dans le domaine parent et ses sous-domaines, transmettez le domaine parent à cet attribut afin qu'un seul cookie partagé soit utilisé.
data-ux_mode Flux d'expérience utilisateur avec le bouton "Se connecter avec Google"
data-allowed_parent_origin Origines autorisées à intégrer l'iFrame intermédiaire. One Tap s'exécute en mode iFrame intermédiaire si cet attribut est présent.
data-intermediate_iframe_close_callback Remplace le comportement par défaut de l'iFrame intermédiaire lorsque les utilisateurs ferment manuellement One Tap.
data-itp_support Active l'expérience utilisateur One Tap mise à niveau sur les navigateurs ITP.
data-login_hint Ignorez la sélection du compte en fournissant un indice à l'utilisateur.
data-hd Limitez la sélection de comptes par domaine.
data-use_fedcm_for_prompt Autorisez le navigateur à contrôler les invites de connexion des utilisateurs et à assurer la médiation du flux de connexion entre votre site Web et Google.

Types d'attributs

Les sections suivantes contiennent des détails sur le type de chaque attribut et un exemple.

id_client_données

Cet attribut correspond à l'ID client de votre application, qui se trouve et est créé dans la Google Developers Console. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Oui data-client_id="CLIENT_ID.apps.googleusercontent.com"

données-auto_prompt

Cet attribut détermine si l'utilisateur doit afficher One Tap ou non. La valeur par défaut est true. Le paiement sans contact Google One ne s'affiche pas lorsque cette valeur est false. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
boolean Facultatif data-auto_prompt="true"

Sélection automatique des données

Cet attribut détermine si un jeton d'ID doit être renvoyé automatiquement, sans interaction de l'utilisateur, si une seule session Google a approuvé votre application. La valeur par défaut est false. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
boolean Facultatif data-auto_select="true"

data-login_uri

Cet attribut est l'URI du point de terminaison de votre connexion.

Cette valeur doit correspondre exactement à l'un des URI de redirection autorisés pour le client OAuth 2.0, que vous avez configuré dans la console API et conforme à nos règles de validation des URI de redirection.

Cet attribut peut être omis si la page actuelle est votre page de connexion, auquel cas l'identifiant est publié sur cette page par défaut.

La réponse d'identification du jeton d'ID est publiée sur votre point de terminaison de connexion lorsqu'aucune fonction de rappel n'est définie et qu'un utilisateur clique sur les boutons "Se connecter avec Google" ou "One Tap", ou lorsqu'une signature automatique a lieu.

Pour en savoir plus, consultez le tableau suivant:

Type Facultatif Exemple
URL La valeur par défaut correspond à l'URI de la page actuelle ou à la valeur que vous spécifiez.
Ignoré lorsque data-ux_mode="popup" et data-callback sont définis.
data-login_uri="https://www.example.com/login"

Votre point de terminaison de connexion doit gérer les requêtes POST contenant une clé credential dont le corps contient une valeur de jeton d'ID.

Voici un exemple de requête envoyée à votre point de terminaison de connexion:

POST /login HTTP/1.1
Host: www.example.com
Content-Type: application/x-www-form-urlencoded

credential=ID_TOKEN

data-callback

Cet attribut correspond au nom de la fonction JavaScript qui gère le jeton d'ID renvoyé. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Obligatoire si data-login_uri n'est pas défini. data-callback="handleToken"

Vous pouvez utiliser l'un des attributs data-login_uri et data-callback. Elle dépend des configurations de composant et du mode UX suivantes:

  • L'attribut data-login_uri est requis pour le mode d'expérience utilisateur redirect du bouton "Se connecter avec Google", qui ignore l'attribut data-callback.

  • L'un de ces deux attributs doit être défini pour le mode UX Google One Tap et le bouton Google Sign-In popup. Si les deux sont définis, l'attribut data-callback a une priorité plus élevée.

Les fonctions JavaScript d'un espace de noms ne sont pas compatibles avec l'API HTML. Utilisez plutôt une fonction JavaScript globale sans espace de noms. Par exemple, utilisez mylibCallback au lieu de mylib.callback.

data-native_login_uri

Cet attribut est l'URL du point de terminaison de votre gestionnaire d'identifiants de mots de passe. Si vous définissez l'attribut data-native_login_uri ou data-native_callback, la bibliothèque JavaScript utilise le gestionnaire d'identifiants natif en l'absence de session Google. Vous n'êtes pas autorisé à définir à la fois les attributs data-native_callback et data-native_login_uri. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-login_uri="https://www.example.com/password_login"

rappel data-native_callback

Cet attribut est le nom de la fonction JavaScript qui gère les identifiants de mot de passe renvoyés par le gestionnaire d'identifiants natif du navigateur. Si vous définissez l'attribut data-native_login_uri ou data-native_callback, la bibliothèque JavaScript utilise le gestionnaire d'identifiants natif en l'absence de session Google. Vous n'êtes pas autorisé à définir à la fois data-native_callback et data-native_login_uri. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-native_callback="handlePasswordCredential"

Les fonctions JavaScript d'un espace de noms ne sont pas compatibles avec l'API HTML. Utilisez plutôt une fonction JavaScript globale sans espace de noms. Par exemple, utilisez mylibCallback au lieu de mylib.callback.

data-native_id_param

Lorsque vous envoyez les identifiants du mot de passe au point de terminaison du gestionnaire d'identifiants de mot de passe, vous pouvez spécifier le nom du paramètre pour le champ credential.id. Le nom par défaut est email. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
URL Facultatif data-native_id_param="user_id"

data-native_password_param

Lorsque vous envoyez les identifiants du mot de passe au point de terminaison du gestionnaire d'identifiants de mot de passe, vous pouvez spécifier le nom du paramètre pour la valeur credential.password. Le nom par défaut est password. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
URL Facultatif data-native_password_param="pwd"

data-cancel_on_tap_outside

Cet attribut détermine si la requête One Tap doit être annulée ou non lorsque l'utilisateur clique en dehors de l'invite. La valeur par défaut est true. Pour le désactiver, définissez la valeur sur false. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
boolean Facultatif data-cancel_on_tap_outside="false"

data-prompt_parent_id

Cet attribut définit l'ID DOM de l'élément conteneur. Si elle n'est pas configurée, l'invite One Tap s'affiche en haut à droite de la fenêtre. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-prompt_parent_id="parent_id"

Cet attribut ignore "One Tap" si la valeur du cookie spécifié n'est pas vide. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-skip_prompt_cookie="SID"

nonce de données

Cet attribut est une chaîne aléatoire utilisée par le jeton d'ID pour empêcher les attaques par rejeu. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-nonce="biaqbm70g23"

La longueur du nonce est limitée à la taille JWT maximale acceptée par votre environnement, ainsi qu'aux contraintes de taille HTTP du navigateur et du serveur individuels.

contexte des données

Cet attribut modifie le texte du titre et des messages affichés dans l'invite One Tap. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-context="use"

Le tableau suivant répertorie les contextes disponibles et leur description:

Contexte
signin "Se connecter avec Google"
signup "S'inscrire avec Google"
use "Utiliser avec Google"

rappel_moment_données

Cet attribut est le nom de la fonction de l'écouteur des notifications d'état de l'UI de requête. Pour en savoir plus, consultez le type de données PromptMomentNotification.

Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-moment_callback="logMomentNotification"

Les fonctions JavaScript d'un espace de noms ne sont pas compatibles avec l'API HTML. Utilisez plutôt une fonction JavaScript globale sans espace de noms. Par exemple, utilisez mylibCallback au lieu de mylib.callback.

Si vous devez afficher One Tap dans un domaine parent et ses sous-domaines, transmettez le domaine parent à cet attribut afin qu'un seul cookie à état partagé soit utilisé. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-state_cookie_domain="example.com"

data-ux_mode

Cet attribut définit le flux d'expérience utilisateur utilisé par le bouton "Se connecter avec Google". La valeur par défaut est popup. Cet attribut n'a aucune incidence sur l'expérience utilisateur One Tap. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-ux_mode="redirect"

Le tableau suivant liste les modes d'expérience utilisateur disponibles, ainsi que leur description.

Mode UX
popup Effectue un flux d'expérience utilisateur de connexion dans une fenêtre pop-up.
redirect Effectue un flux d'expérience utilisateur de connexion par une redirection vers toute la page.

data-allowed_parent_origin

Origines autorisées à intégrer l'iFrame intermédiaire. One Tap s'exécute en mode iFrame intermédiaire si cet attribut est présent. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne ou tableau de chaînes Facultatif data-allowed_parent_origin="https://example.com"

Le tableau suivant répertorie les types de valeurs acceptés et leur description.

Types de valeurs
string Un seul URI de domaine "https://example.com"
string array Liste d'URI de domaine séparés par une virgule. "https://news.example.com,https://local.example.com"

Si la valeur de l'attribut data-allowed_parent_origin n'est pas valide, l'initialisation avec One Tap du mode iFrame intermédiaire échoue et s'arrête.

Les préfixes génériques sont également acceptés. Par exemple, "https://*.example.com" correspond à example.com et à ses sous-domaines, à tous les niveaux (par exemple, news.example.com, login.news.example.com). Voici quelques points à retenir lorsque vous utilisez des caractères génériques:

  • Les chaînes de modèle ne peuvent pas être composées uniquement d'un caractère générique et d'un domaine de premier niveau. Par exemple, https://*.com et https://*.co.uk ne sont pas valides. Comme indiqué ci-dessus, "https://*.example.com" correspond à example.com et à ses sous-domaines. Vous pouvez également utiliser une liste d'éléments séparés par une virgule pour représenter deux domaines différents. Par exemple, "https://example1.com,https://*.example2.com" correspond aux domaines example1.com et example2.com, ainsi qu'aux sous-domaines de example2.com.
  • Les domaines génériques doivent commencer par un schéma https:// sécurisé. "*.example.com" est donc considéré comme non valide.

data-intermediate_iframe_close_callback

Remplace le comportement d'iFrame intermédiaire par défaut lorsque les utilisateurs ferment manuellement One Tap en appuyant sur le bouton "X" dans l'interface utilisateur One Tap. Le comportement par défaut consiste à supprimer immédiatement l'iFrame intermédiaire du DOM.

Le champ data-intermediate_iframe_close_callback ne prend effet qu'en mode iFrame intermédiaire. Il ne s'applique qu'à l'iFrame intermédiaire, et non à l'iFrame One Tap. L'interface utilisateur One Tap est supprimée avant l'appel du rappel.

Type Obligatoire Exemple
function Facultatif data-intermediate_iframe_close_callback="logBeforeClose"

Les fonctions JavaScript d'un espace de noms ne sont pas compatibles avec l'API HTML. Utilisez plutôt une fonction JavaScript globale sans espace de noms. Par exemple, utilisez mylibCallback au lieu de mylib.callback.

assistance_data-itp

Ce champ détermine si l' expérience utilisateur One Tap mise à niveau doit être activée dans les navigateurs compatibles avec la fonctionnalité Intelligent Tracking Prevention (ITP). La valeur par défaut est false. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
boolean Facultatif data-itp_support="true"

data-login_hint

Si votre application sait à l'avance quel utilisateur doit être connecté, elle peut fournir un indice de connexion à Google. Si l'opération réussit, la sélection du compte est ignorée. Les valeurs acceptées sont les suivantes: adresse e-mail ou champ sub de jeton d'ID.

Pour en savoir plus, consultez la documentation OpenID Connect pour login_hint.

Type Obligatoire Exemple
Chaîne. Il peut s'agir d'une adresse e-mail ou de la valeur du champ sub du jeton d'ID. Facultatif data-login_hint="elisa.beckett@gmail.com"

données-hd

Lorsqu'un utilisateur possède plusieurs comptes et ne doit se connecter qu'avec son compte Workspace, cette option permet de fournir à Google un indice de nom de domaine. Si l'opération réussit, les comptes utilisateur affichés lors de la sélection des comptes sont limités au domaine fourni. La valeur générique * ne propose que des comptes Workspace à l'utilisateur et exclut les comptes personnels (user@gmail.com) lors de la sélection des comptes.

Pour en savoir plus, consultez la documentation OpenID Connect pour hd.

Type Obligatoire Exemple
Chaîne. Un nom de domaine complet ou *. Facultatif data-hd="*"

data-use_fedcm_for_prompt

Autorisez le navigateur à contrôler les invites de connexion des utilisateurs et à assurer la médiation du flux de connexion entre votre site Web et Google. Valeur par défaut : "false". Pour en savoir plus, consultez la page Migrer vers FedCM.

Type Obligatoire Exemple
boolean Facultatif data-use_fedcm_for_prompt="true"

Élément avec la classe "g_id_signin"

Si vous ajoutez g_id_signin à l'attribut class d'un élément, celui-ci s'affiche sous la forme d'un bouton "Se connecter avec Google".

Vous pouvez afficher plusieurs boutons "Se connecter avec Google" sur la même page. Chaque bouton peut avoir ses propres paramètres visuels. Les paramètres sont définis par les attributs de données suivants.

Attributs de données visuelles

Le tableau suivant répertorie les attributs de données visuels, ainsi que leur description:

Attribut
data-type Type de bouton: icône ou bouton standard.
data-theme Thème du bouton. Par exemple, rembourré_bleu ou plein_noir.
data-size Taille du bouton Par exemple, petite ou grande.
data-text Texte du bouton Par exemple, "Se connecter avec Google" ou "S'inscrire avec Google".
data-shape Forme du bouton. (par exemple, rectangulaire ou circulaire).
data-logo_alignment Alignement du logo Google: à gauche ou au centre.
data-width Largeur du bouton, en pixels.
data-locale Le texte du bouton s'affiche dans la langue définie dans cet attribut.
data-click_listener Si elle est définie, cette fonction est appelée lorsque l'utilisateur clique sur le bouton "Se connecter avec Google".

Types d'attributs

Les sections suivantes contiennent des détails sur le type de chaque attribut et un exemple.

type de données

Type de bouton La valeur par défaut est standard. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Oui data-type="icon"

Le tableau suivant répertorie les types de boutons disponibles, ainsi que leur description:

Type
standard
Bouton avec du texte ou des informations personnalisées.
icon
Bouton en forme d'icône sans texte.

data-theme

Thème du bouton. La valeur par défaut est outline. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-theme="filled_blue"

Le tableau suivant répertorie les thèmes disponibles et leur description:

Thème
outline
Bouton standard sur fond blanc Bouton en forme d&#39;icône sur fond blanc Bouton personnalisé sur fond blanc
Thème standard du bouton.
filled_blue
Bouton standard sur fond bleu Bouton en forme d&#39;icône sur fond bleu Bouton personnalisé sur fond bleu
Thème du bouton bleu.
filled_black
Bouton standard sur fond noir Bouton en forme d&#39;icône sur fond noir Bouton personnalisé sur fond noir
Thème du bouton rempli de noir.

data-size

Taille du bouton La valeur par défaut est large. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-size="small"

Le tableau suivant répertorie les tailles de boutons disponibles, ainsi que leur description.

Taille
large
Un grand bouton standard Un gros bouton d&#39;icône Un grand bouton personnalisé
Grand bouton.
medium
Un bouton de taille moyenne Un bouton représentant une icône de taille moyenne
Bouton de taille moyenne.
small
Un petit bouton Un petit bouton en forme d&#39;icône
Un petit bouton.

texte-données

Texte du bouton La valeur par défaut est signin_with. Il n'existe aucune différence visuelle pour le texte des boutons d'icône ayant des attributs data-text différents. Seule exception : lorsque le texte est lu pour l'accessibilité à l'écran.

Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-text="signup_with"

Le tableau suivant répertorie les boutons disponibles et leur description:

Texte
signin_with
Un bouton standard intitulé &quot;Se connecter avec Google&quot; Un bouton d&#39;icône sans texte visible
Le texte du bouton est "Se connecter avec Google".
signup_with
Un bouton standard intitulé &quot;S&#39;inscrire avec Google&quot; Un bouton d&#39;icône sans texte visible
Le texte du bouton est "S'inscrire avec Google".
continue_with
Un bouton standard intitulé &quot;Continuer avec Google&quot; Un bouton d&#39;icône sans texte visible
Le texte du bouton est "Continuer avec Google".
signin
Un bouton standard intitulé &quot;Se connecter&quot; Un bouton d&#39;icône sans texte visible
Le texte du bouton est "Se connecter".

forme de données

Forme du bouton. La valeur par défaut est rectangular. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-shape="rectangular"

Le tableau suivant répertorie les formes de boutons disponibles, ainsi que leur description:

Forme
rectangular
Un bouton rectangulaire standard Bouton en forme d&#39;icône rectangulaire Bouton personnalisé rectangulaire
Bouton rectangulaire. S'il est utilisé pour le type de bouton icon, il est identique à square.
pill
Un bouton standard en forme de pilule Bouton en forme de pilule Bouton personnalisé en forme de pilule
Bouton en forme de pilule. S'il est utilisé pour le type de bouton icon, il est identique à circle.
circle
Bouton circulaire standard Bouton en forme de cercle Bouton circulaire personnalisé
Bouton en forme de cercle. S'il est utilisé pour le type de bouton standard, il est identique à pill.
square
Un bouton carré standard Bouton avec icône carrée Bouton personnalisé carré
Bouton carré. S'il est utilisé pour le type de bouton standard, il est identique à rectangular.

alignement du logo

L'alignement du logo Google. La valeur par défaut est left. Cet attribut ne s'applique qu'au type de bouton standard. Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-logo_alignment="center"

Le tableau suivant répertorie les alignements disponibles et leur description:

logo_alignment
left
Bouton standard avec le logo G à gauche
Aligne le logo Google à gauche.
center
Bouton standard avec le logo G au centre
Centre le logo Google.

largeur de données

Largeur minimale du bouton, en pixels. La largeur maximale disponible est de 400 pixels.

Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-width=400

paramètres-paramètres régionaux des données

Facultatif. Permet d'afficher le texte du bouton en utilisant les paramètres régionaux spécifiés. Sinon, il correspond par défaut aux paramètres du compte Google ou du navigateur de l'utilisateur. Ajoutez le paramètre hl et le code de langue à la directive src lors du chargement de la bibliothèque, par exemple : gsi/client?hl=<iso-639-code>.

Si cette règle n'est pas configurée, les paramètres régionaux par défaut du navigateur ou les préférences de l'utilisateur de la session Google sont utilisés. Par conséquent, les utilisateurs peuvent voir différentes versions des boutons localisés, et peut-être avec différentes tailles.

Pour en savoir plus, consultez le tableau suivant:

Type Obligatoire Exemple
chaîne Facultatif data-locale="zh_CN"

click_listener

Vous pouvez définir une fonction JavaScript à appeler lorsque l'utilisateur clique sur le bouton "Se connecter avec Google" à l'aide de l'attribut click_listener.

  google.accounts.id.renderButton(document.getElementById("signinDiv"), {
      theme: 'outline',
      size: 'large',
      click_listener: onClickHandler
    });

  
  function onClickHandler(){
    console.log("Sign in with Google button clicked...")
  }
  

Dans cet exemple, le message Sign in with Google button appuyé... est enregistré dans la console lorsque l'utilisateur clique sur le bouton "Sign in with Google" (Se connecter avec Google).

Intégration côté serveur

Vos points de terminaison côté serveur doivent gérer les requêtes HTTP POST suivantes.

Point de terminaison du gestionnaire de jetons d'ID

Le point de terminaison du gestionnaire de jetons d'ID traite le jeton d'ID. En fonction de l'état du compte correspondant, vous pouvez connecter l'utilisateur, puis le rediriger vers une page d'inscription ou vers une page d'association de compte pour obtenir des informations supplémentaires.

La requête HTTP POST contient les informations suivantes:

Format Nom Description
Cookie g_csrf_token Chaîne aléatoire qui change à chaque requête envoyée au point de terminaison du gestionnaire.
Paramètre de requête g_csrf_token Chaîne identique à la valeur de cookie précédente (g_csrf_token.)
Paramètre de requête credential Jeton d'ID émis par Google.
Paramètre de requête select_by Mode de sélection de l'identifiant.

identifiant

Une fois décodé, le jeton d'ID ressemble à l'exemple suivant :

header
{
  "alg": "RS256",
  "kid": "f05415b13acb9590f70df862765c655f5a7a019e", // JWT signature
  "typ": "JWT"
}
payload
{
  "iss": "https://accounts.google.com", // The JWT's issuer
  "nbf":  161803398874,
  "aud": "314159265-pi.apps.googleusercontent.com", // Your server's client ID
  "sub": "3141592653589793238", // The unique ID of the user's Google Account
  "hd": "gmail.com", // If present, the host domain of the user's GSuite email address
  "email": "elisa.g.beckett@gmail.com", // The user's email address
  "email_verified": true, // true, if Google has verified the email address
  "azp": "314159265-pi.apps.googleusercontent.com",
  "name": "Elisa Beckett",
                            // If present, a URL to user's profile picture
  "picture": "https://lh3.googleusercontent.com/a-/e2718281828459045235360uler",
  "given_name": "Eliza",
  "family_name": "Beckett",
  "iat": 1596474000, // Unix timestamp of the assertion's creation time
  "exp": 1596477600, // Unix timestamp of the assertion's expiration time
  "jti": "abc161803398874def"
}

Le champ sub est un identifiant unique global associé au compte Google. Utilisez uniquement le champ sub comme identifiant pour l'utilisateur, car il est unique parmi tous les comptes Google et n'est jamais réutilisé. N'utilisez pas l'adresse e-mail comme identifiant, car un compte Google peut avoir plusieurs adresses e-mail à différents moments.

Les champs email, email_verified et hd vous permettent de déterminer si Google héberge une adresse e-mail et si elle fait autorité. Dans les cas où Google fait autorité, il est confirmé que l'utilisateur est le titulaire légitime du compte.

Cas pour lesquels Google fait autorité:

  • email comporte un suffixe @gmail.com. Il s'agit d'un compte Gmail.
  • email_verified est défini sur "true" et hd est défini. Il s'agit d'un compte Google Workspace.

Les utilisateurs peuvent créer un compte Google sans utiliser Gmail ni Google Workspace. Lorsque email ne contient pas de suffixe @gmail.com et que hd n'est pas spécifié, Google ne fait pas autorité, et il est recommandé d'utiliser un mot de passe ou d'autres méthodes d'authentification pour vérifier l'utilisateur. email_verified peut également être défini sur "true" (vrai), car Google a initialement validé l'utilisateur lors de la création du compte Google. Toutefois, la propriété du compte de messagerie tiers peut avoir changé depuis.

Le champ exp indique le délai d'expiration à utiliser pour vérifier le jeton côté serveur. Ce délai est d'une heure pour le jeton d'ID obtenu via la fonctionnalité Se connecter avec Google. Vous devez vérifier le jeton avant l'heure d'expiration. N'utilisez pas exp pour gérer les sessions. Un jeton d'ID arrivé à expiration ne signifie pas que l'utilisateur est déconnecté. Votre application est responsable de la gestion des sessions de vos utilisateurs.

select_by

Le tableau suivant répertorie les valeurs possibles du champ select_by. Le type de bouton utilisé avec l'état de la session et du consentement permet de définir la valeur,

  • L'utilisateur a appuyé sur le bouton One Tap ou Se connecter avec Google, ou a utilisé le processus de connexion automatique sans contact.

  • Une session existante a été trouvée, ou l'utilisateur a sélectionné et s'est connecté à un compte Google pour établir une nouvelle session.

  • Avant de partager les identifiants de jeton d'ID avec votre application,

    • qu'il a appuyé sur le bouton "Confirmer" pour l'autoriser à partager ses identifiants ; ou
    • avait déjà donné son consentement et utilisé l'option "Sélectionner un compte" pour choisir un compte Google.

La valeur de ce champ est définie sur l'un de ces types,

Valeur Description
auto Connexion automatique d'un utilisateur disposant d'une session existante et ayant déjà autorisé le partage des identifiants.
user Un utilisateur disposant d'une session existante et ayant déjà accordé son consentement a appuyé sur le bouton "Continuer en tant que" de One Tap pour partager ses identifiants.
user_1tap Un utilisateur disposant d'une session existante a appuyé sur le bouton "Continuer en tant que" One Tap pour donner son autorisation et partager ses identifiants. S'applique uniquement à Chrome v75 et versions ultérieures.
user_2tap Un utilisateur n'ayant pas de session existante a appuyé sur le bouton One Tap "Continuer en tant que" pour sélectionner un compte, puis a appuyé sur le bouton "Confirmer" dans une fenêtre pop-up pour donner son autorisation et partager ses identifiants. S'applique aux navigateurs non basés sur Chromium.
btn Un utilisateur disposant d'une session existante et ayant déjà accordé son consentement a appuyé sur le bouton "Se connecter avec Google" et a sélectionné un compte Google dans "Choisir un compte" pour partager ses identifiants.
btn_confirm Un utilisateur disposant d'une session existante a appuyé sur le bouton "Se connecter avec Google", puis sur le bouton "Confirmer" pour accorder son consentement et partager ses identifiants.
btn_add_session Un utilisateur sans session existante ayant déjà accordé son consentement a appuyé sur le bouton "Se connecter avec Google" pour sélectionner un compte Google et partager ses identifiants.
btn_confirm_add_session Un utilisateur sans session existante a d'abord appuyé sur le bouton "Se connecter avec Google" pour sélectionner un compte Google, puis a appuyé sur le bouton "Confirmer" pour autoriser et partager ses identifiants.

Point de terminaison du gestionnaire d'identifiants de mots de passe

Le point de terminaison du gestionnaire d'identifiants de mot de passe traite les identifiants de mot de passe récupérés par le gestionnaire d'identifiants natif.

La requête HTTP POST contient les informations suivantes:

Format Nom Description
Cookie g_csrf_token Chaîne aléatoire qui change à chaque requête envoyée au point de terminaison du gestionnaire.
Paramètre de requête g_csrf_token Chaîne identique à la valeur de cookie précédente, g_csrf_token.
Paramètre de requête email Jeton d'ID émis par Google.
Paramètre de requête password Mode de sélection de l'identifiant.