Documentation de référence sur l'API Iframe intermédiaire

Cette page de référence explique comment charger un iFrame intermédiaire dans des pages HTML.

Charger la bibliothèque JavaScript Iframe intermédiaire

Placez l'extrait de code suivant sur toutes les pages HTML que Google One Tap doit afficher:

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

API HTML

Vous pouvez charger l'iFrame intermédiaire en incluant un élément HTML avec l'attribut ID défini sur g_id_intermediate_iframe. Consultez l'exemple d'extrait de code suivant:

<script src="https://accounts.google.com/gsi/intermediate"></script>
<div id="g_id_intermediate_iframe"
     data-src="https://example.com/onetap_iframe.html">
</div>

Élément portant l'ID "g_id_intermediate_iframe"

Vous pouvez placer les attributs de données iFrame intermédiaires dans n'importe quel élément visible ou invisible, tels que <div> et <span>. La seule condition requise est que l'ID de l'élément soit défini sur g_id_intermediate_iframe. Ne le placez pas sur plusieurs éléments.

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

données-src

Cet attribut est l'URI de votre iFrame intermédiaire One Tap. Pour en savoir plus, consultez le tableau suivant:

données terminées

Cet attribut est une méthode de rappel JavaScript déclenchée à la fin de l'expérience utilisateur One Tap.

Par défaut, la page de contenu est rechargée à la fin de l'expérience utilisateur One Tap. Vous pouvez ignorer le comportement par défaut en fournissant votre propre rappel "Terminé". Pour en savoir plus, consultez le tableau ci-dessous:

API JavaScript

Vous pouvez charger l'iFrame intermédiaire en appelant une méthode JavaScript.

Méthode: google.accounts.id.esseIntermediate

La méthode google.accounts.id.initializeIntermediate charge l'iFrame intermédiaire en fonction de l'objet de configuration. Consultez l'exemple de code suivant de la méthode:

google.accounts.id.initializeIntermediate(IntermediateConfig)

L'exemple de code suivant met en œuvre la méthode google.accounts.id.initializeIntermediate avec une fonction onload:

<script>
  window.onload = function () {
    google.accounts.id.initializeIntermediate({
      src: 'https://example.com/intermediate'
    });
  };
</script>

Type de données: IntermediateConfig

Le tableau suivant présente les champs et leur description:

src

Ce champ correspond à l'URI de votre iFrame intermédiaire One Tap. Pour en savoir plus, consultez le tableau suivant:

OK

Ce champ correspond à la méthode de rappel JavaScript à déclencher une fois l'expérience utilisateur One Tap terminée.

Par défaut, la page de contenu est rechargée à la fin de l'expérience utilisateur One Tap. Vous pouvez ignorer le comportement par défaut en fournissant votre propre rappel "Terminé". Pour en savoir plus, consultez le tableau ci-dessous: