Documentation de référence sur l'API JavaScript de prise en charge des iFrames intermédiaires

Cette page de référence décrit l'API JavaScript Intermediate iframe Support, utilisée par One Tap pour manipuler l'iFrame intermédiaire dans l'expérience utilisateur ultérieure.

Consultez le guide Intégrer One Tap à l'aide d'un iFrame pour savoir comment utiliser des iFrames intermédiaires.

Le tableau suivant liste toutes les méthodes disponibles et leurs comportements.

Méthodes
verifyParentOrigin	effectue la validation de l'origine parentale
notifyParentClose	Notifie le frame parent que le flux UX One Tap est ignoré
notifyParentDone	notifie le frame parent que le flux UX One Tap est terminé
notifyParentResize	notifie le cadre parent de redimensionner l'iframe intermédiaire
notifyParentTapOutsideMode	Indique au frame parent s'il doit annuler l'iframe intermédiaire lorsque l'utilisateur clique en dehors de l'iframe intermédiaire.

Charger la bibliothèque JavaScript Intermediate Iframe Support

Placez l'extrait de code suivant dans toutes les pages HTML où vous souhaitez charger l'iFrame intermédiaire :

<script src="https://accounts.google.com/gsi/intermediatesupport"></script>

Méthode : google.accounts.id.intermediate.verifyParentOrigin

La méthode google.accounts.id.intermediate.verifyParentOrigin effectue la validation de l'origine parente. Consultez l'exemple de code suivant de la méthode :

google.accounts.id.intermediate.verifyParentOrigin(
    origins, verifiedCallback, verificationFailedCallback)

L'exemple de code suivant montre comment afficher l'UI uniquement après la validation de l'origine parente :

<script>
  window.onload = () => {
    google.accounts.id.intermediate.verifyParentOrigin(
        "https://example.com", showUI, showError);
  };
</script>

Le tableau suivant liste les paramètres :

Paramètre
origins	Origines autorisées à intégrer l'iFrame intermédiaire.
verifiedCallback	Méthode de rappel JavaScript déclenchée lorsque l'origine parente actuelle est autorisée à intégrer l'iFrame intermédiaire.
verificationFailedCallback	Méthode de rappel JavaScript déclenchée lorsque l'origine parente actuelle n'est pas autorisée à intégrer l'iFrame intermédiaire.

origines

Origines autorisées à intégrer l'iFrame intermédiaire. Pour en savoir plus, consultez le tableau suivant :

Type	Obligatoire	Exemple
chaîne, tableau de chaînes ou fonction	Facultatif	allowed_parent_origin: "https://example.com"

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

Types de valeurs
string	Un seul URI de domaine.	"https://example.com"
string array	Tableau d'URI de domaine.	"https://news.example.com,https://local.example.com"

Remarque : Une chaîne contenant des URI séparés par une virgule n'est pas valide. Utilisez plutôt un tableau JavaScript.

verifiedCallback

Ce champ est une méthode de rappel JavaScript déclenchée lorsque l'origine parente actuelle est autorisée à intégrer l'iFrame intermédiaire.

verificationFailedCallback

Ce champ est une méthode de rappel JavaScript déclenchée lorsque l'origine parente actuelle n'est pas autorisée à intégrer l'iFrame intermédiaire.

Avertissement : Si la page de contenu ne répond pas à la demande de validation du domaine, la procédure de validation attend indéfiniment. Dans ce cas, ni verifiedCallback ni verificationFailedCallback n'est appelé.

Méthode : google.accounts.id.intermediate.notifyParentClose

La méthode google.accounts.id.intermediate.notifyParentClose indique au frame parent de fermer l'iFrame intermédiaire lorsque le flux d'expérience utilisateur One Tap est ignoré. Consultez l'exemple de code suivant de la méthode :

google.accounts.id.intermediate.notifyParentClose()

Méthode : google.accounts.id.intermediate.notifyParentDone

La méthode google.accounts.id.intermediate.notifyParentDone indique au frame parent de fermer l'iframe intermédiaire et d'actualiser l'état de connexion. Consultez l'exemple de code suivant pour la méthode :

google.accounts.id.intermediate.notifyParentDone()

Méthode : google.accounts.id.intermediate.notifyParentResize

La méthode google.accounts.id.intermediate.notifyParentResize indique au frame parent de redimensionner l'iFrame intermédiaire. Consultez l'exemple de code suivant de la méthode :

google.accounts.id.intermediate.notifyParentResize(height)

Remarque : Vous ne pouvez pas modifier la largeur de l'iFrame intermédiaire.

height

Nouvelle hauteur en pixels. Ce champ est obligatoire. La valeur doit être un nombre non négatif.

Si le paramètre de hauteur est supérieur à 0, l'iframe intermédiaire est défini sur la nouvelle hauteur. Si le paramètre de hauteur est défini sur 0, l'iFrame intermédiaire devient invisible. Un iFrame masqué n'est pas fermé. Il peut être affiché ultérieurement par un autre appel de méthode de redimensionnement.

Méthode : google.accounts.id.intermediate.notifyParentTapOutsideMode

La méthode google.accounts.id.intermediate.notifyParentTapOutsideMode indique au frame parent s'il doit annuler l'iFrame intermédiaire lorsque l'utilisateur clique en dehors de l'iFrame intermédiaire. Consultez l'exemple de code suivant de la méthode :

google.accounts.id.intermediate.notifyParentTapOutsideMode(cancel)

annuler

Cette valeur booléenne obligatoire indique s'il faut annuler l'iframe intermédiaire lorsque l'utilisateur clique en dehors de l'iframe intermédiaire.