Recevoir des notifications sur l'état de l'UI des invites

Pour faciliter la connexion ou l'inscription de vos utilisateurs, vous pouvez communiquer avec plusieurs fournisseurs d'identité afin de trouver les identifiants disponibles. Vous voudrez peut-être connaître l'état de l'UI d'invite pour pouvoir appeler le fournisseur d'identité suivant.

Pour recevoir des notifications sur l'état de l'UI de l'invite à différents moments, définissez un nom de fonction de rappel sur l'attribut data-moment_callback ou une fonction sur la méthode prompt() si vous utilisez l'API JavaScript.

Les notifications sont envoyées pour les moments suivants:

  • Moment d'affichage:cela se produit après l'appel de la méthode prompt(). La notification contient une valeur booléenne pour indiquer si l'interface utilisateur est affichée ou non.

  • Moment ignoré:cela se produit lorsque l'invite One Tap est fermée par une annulation automatique ou manuelle, ou lorsque Google ne parvient pas à émettre d'identifiants, par exemple lorsque la session sélectionnée est déconnectée de Google.

    Dans ce cas, nous vous recommandons de passer aux fournisseurs d'identité suivants, le cas échéant.

  • Moment de rejet:cela se produit lorsque Google récupère un identifiant ou qu'un utilisateur souhaite arrêter le flux de récupération des identifiants. Par exemple, lorsque l'utilisateur commence à saisir son nom d'utilisateur et son mot de passe dans la boîte de dialogue de connexion, vous pouvez appeler la méthode google.accounts.id.cancel() pour fermer l'invite One Tap et déclencher un moment ignoré.

L'exemple de code suivant implémente un moment ignoré:

<script>
  function continueWithNextIdp(notification) {
      if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
          // try Next provider if One Tap is not displayed or skipped
      }
  }
</script>
...
<div id="g_id_onload"
     data-client_id="YOUR_GOOGLE_CLIENT_ID"
     data-login_uri="https://your.domain/your_login_endpoint"
     data-moment_callback="continueWithNextIdp"
</div>