Cette page de référence explique comment charger un iFrame intermédiaire dans des pages HTML.
Charger la bibliothèque JavaScript d'iFrame intermédiaire
Insérez l'extrait de code suivant dans les pages HTML que vous souhaitez que Google One Tap affiche:
<script src="https://accounts.google.com/gsi/intermediate"></script>
API HTML
Vous pouvez charger l'iFrame intermédiaire en incluant un élément HTML dont l'attribut ID est 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_ internal_iframe"
Vous pouvez placer les attributs de données d'iframe intermédiaires dans n'importe quel élément visible ou invisible, tel que <div>
et <span>
. La seule exigence est que l'ID de l'élément soit défini sur g_id_intermediate_iframe
. N'attribuez pas cet ID à plusieurs éléments.
Le tableau suivant répertorie les attributs de données et leurs descriptions:
Attribut | |
---|---|
data-src |
URI de l'iFrame intermédiaire One Tap |
data-done |
Méthode de rappel JavaScript à déclencher lorsque l'expérience utilisateur en un seul geste est terminée. |
data-src
Cet attribut correspond à l'URI de votre iFrame One Tap intermédiaire. Pour en savoir plus, consultez le tableau suivant:
Type | Obligatoire | Exemple |
---|---|---|
chaîne | Oui | data-src="https://example.com/onetap_iframe.html" |
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 actualisée à la fin de l'expérience utilisateur One Tap. Vous pouvez remplacer le comportement par défaut en fournissant votre propre rappel de fin. Pour en savoir plus, consultez le tableau suivant:
Type | Obligatoire | Exemple |
---|---|---|
Fonction | Facultatif | data-done="onOneTapSuccess" |
API JavaScript
Vous pouvez charger l'iframe intermédiaire en appelant une méthode JavaScript.
Méthode: google.accounts.id.initializeIntermediate
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 implémente 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 répertorie les champs avec leur description:
Champ | |
---|---|
src |
URI de l'iFrame intermédiaire One Tap |
done |
Méthode de rappel JavaScript à déclencher lorsque l'expérience utilisateur en un seul geste est une. |
src
Ce champ correspond à l'URI de l'iFrame intermédiaire One Tap. Pour en savoir plus, consultez le tableau suivant:
Type | Obligatoire | Exemple |
---|---|---|
chaîne | Oui | src: "https://example.com/onetap_iframe.html" |
OK
Ce champ correspond à la méthode de rappel JavaScript à déclencher lorsque l'expérience utilisateur en un seul geste est terminée.
Par défaut, la page de contenu est actualisée à la fin de l'expérience utilisateur One Tap. Vous pouvez ignorer le comportement par défaut en fournissant votre propre rappel. Pour en savoir plus, consultez le tableau suivant:
Type | Obligatoire | Exemple |
---|---|---|
Fonction | Facultatif | done: onOneTapSuccess |