Cette page a été traduite par l'API Cloud Translation.

Migrer vers FedCM

Ce guide vous aide à comprendre les modifications apportées à votre application Web par l'API Federated Credentials Management (FedCM).

Lorsque FedCM est activé, le navigateur affiche les invites utilisateur et aucun cookie tiers n'est utilisé.

Présentation

La Privacy Sandbox pour le Web et la suppression par Chrome des cookies tiers sur le Web apportent des modifications importantes aux services Google Identity et à la procédure de connexion des utilisateurs.

FedCM permet des flux de connexion plus privés sans avoir à utiliser de cookies tiers. Le navigateur contrôle les paramètres utilisateur, affiche les invites utilisateur et ne contacte un fournisseur d'identité tel que Google qu'après avoir obtenu le consentement explicite de l'utilisateur.

Pour la plupart des sites Web, la migration s'effectue facilement grâce à des mises à jour rétrocompatibles de la bibliothèque JavaScript Google Identity Services.

Avant de commencer

Vérifiez que la version de votre navigateur et sa version sont compatibles avec l'API FedCM. Passez à une version plus récente si nécessaire.

Avant de tester les flux de connexion avec les cookies tiers bloqués, ouvrez chrome://flags et activez la fonctionnalité expérimentale FedCmWithoutThirdPartyCookies. Cette étape n'est nécessaire que jusqu'à ce qu'elle devienne la valeur par défaut. En outre, le paramètre Connexion tierce doit être activé dans Chrome.

Migrer votre application Web

Suivez ces étapes pour activer FedCM, évaluer l'impact potentiel de la migration et, si nécessaire, apporter des modifications à votre application Web existante:

Ajoutez un indicateur booléen pour activer FedCM lors de l'initialisation à l'aide de la commande suivante:
- HTML, définissez l'attribut data-use_fedcm_for_prompt sur true.
- JavaScript, définissez use_fedcm_for_prompt sur true dans l'objet IdConfiguration.
Supprimez toute utilisation de la valeur opt_out_or_no_session renvoyée dans l'objet PromptMomentNotication.

Pour améliorer la confidentialité des utilisateurs, le rappel google.accounts.id.prompt ne renvoie plus de résultats liés aux paramètres utilisateur ou à l'état de la session.
Mettez à jour les parcours utilisateur et le code du site Web afin de gérer les notifications différées des événements isDisplayMoment().

Pour améliorer la confidentialité des utilisateurs, les notifications d'affichage des moments sont intentionnellement retardées de manière aléatoire lorsque FedCM est activé. Les notifications peuvent être reçues jusqu'à une minute après l'événement réel. Lorsque vous utilisez isDisplayMoment pour afficher de manière conditionnelle des invites ou déclencher une interaction utilisateur, tenez compte de la durée variable de votre conception de l'expérience utilisateur.
Supprimez les attributs de style position de data-prompt_parent_id et de intermediate_iframes.

Le navigateur contrôle la taille et la position des invites utilisateur. Les positions personnalisées ne sont pas compatibles avec One Tap sur ordinateur.
Si nécessaire, mettez à jour la mise en page.

Le navigateur contrôle la taille et la position des invites utilisateur. En fonction de la mise en page des pages individuelles, certains contenus peuvent être superposés.

Modifiez la mise en page pour améliorer l'expérience utilisateur lorsque des informations importantes sont dissimulées.
Ajoutez l'attribut allow="identity-credentials-get" au frame parent si votre application Web appelle l'API One Tap à partir d'iFrames multi-origines.

Un iFrame est considéré comme multi-origine si son origine n'est pas exactement identique à l'origine parente. Par exemple :
- Domaines différents: https://example1.com et https://example2.com
- Différents domaines de premier niveau: https://example.uk et https://example.jp
- Sous-domaines: https://example.com et https://login.example.com
Pour améliorer la confidentialité des utilisateurs, lorsque l'API One Tap est appelée à partir d'iFrames multi-origines, vous devez ajouter l'attribut allow="identity-credentials-get" dans chaque balise iframe du frame parent:
```
<iframe src="https://your.cross-origin/onetap.page" allow="identity-credentials-get"></iframe>
```
Si votre application utilise un iFrame qui contient un autre iFrame, vous devez vous assurer que l'attribut est ajouté à chaque iFrame, y compris à tous les sous-iFrames.

Prenons l'exemple du scénario suivant:
- Le document du haut (https://www.example.uk) contient un iFrame nommé "iFrame A", qui intègre une page (https://logins.example.com).
- Cette page intégrée (https://logins.example.com) contient également un iFrame nommé "iFrame B", qui intègre à nouveau une page (https://onetap.example2.com) hébergeant One Tap.
Pour que One Tap s'affiche correctement, l'attribut doit être ajouté aux tags iFrame A et iFrame B.
Ajoutez ces directives à votre CSP (Content Security Policy).

Cette étape est facultative, car tous les sites Web ne choisissent pas de définir une CSP.
Suppression de la compatibilité des pages AMP (Accelerated Mobile Pages) avec la connexion.

La prise en charge de la connexion utilisateur pour les pages AMP est une fonctionnalité facultative des SIG que votre application Web peut avoir implémentée. Si tel est le cas,

Supprimez toutes les références aux éléments suivants:
- Élément personnalisé amp-onetap-google
- <script async custom-element="amp-onetap-google" src="https://cdn.ampproject.org/v0/amp-onetap-google-0.1.js"></script>
Envisagez de rediriger les demandes de connexion d'AMP vers le flux de connexion HTML de votre site Web. Notez que le Intermediate Iframe Support API associé n'est pas affecté.