L'API Credential Management est une API de navigateur normalisée qui fournit une interface de programmation entre le site et le navigateur pour une connexion fluide sur tous les appareils.
L'API Credential Management:
- Élimine les frictions dans les flux de connexion : les utilisateurs peuvent se reconnecter automatiquement à un site même si leur session a expiré ou s'ils ont enregistré des identifiants sur un autre appareil.
- Connexion en un geste avec le sélecteur de compte : les utilisateurs peuvent choisir un compte dans un sélecteur de compte natif.
- Stocke les identifiants : votre application peut stocker une combinaison de nom d'utilisateur et de mot de passe, ou même des informations de compte fédérées. Ces identifiants peuvent être synchronisés entre les appareils par le navigateur.
Vous voulez le voir en action ? Essayez la démonstration de l'API de gestion des identifiants et examinez le code.
Vérifier la compatibilité du navigateur avec l'API Credential Management
Avant d'utiliser l'API Credential Management, vérifiez si PasswordCredential
ou FederatedCredential
est compatible.
if (window.PasswordCredential || window.FederatedCredential) {
// Call navigator.credentials.get() to retrieve stored
// PasswordCredentials or FederatedCredentials.
}
Utilisateur connecté
Pour connecter l'utilisateur, récupérez les identifiants à partir du gestionnaire de mots de passe du navigateur et utilisez-les pour connecter l'utilisateur.
Exemple :
- Lorsqu'un utilisateur accède à votre site et qu'il n'est pas connecté, appelez
navigator.credentials.get()
. - Utilisez les identifiants récupérés pour connecter l'utilisateur.
- Mettez à jour l'interface utilisateur pour indiquer que l'utilisateur s'est connecté.
Pour en savoir plus, consultez la section Connecter des utilisateurs.
Enregistrer ou mettre à jour les identifiants utilisateur
Si l'utilisateur s'est connecté avec un fournisseur d'identité fédérée tel que Google Sign-In, Facebook ou GitHub:
- Une fois que l'utilisateur s'est connecté ou a créé un compte, créez l'
FederatedCredential
en utilisant son adresse e-mail comme ID et spécifiez le fournisseur d'identité avecFederatedCredentials.provider
. - Enregistrez l'objet d'identification à l'aide de
navigator.credentials.store()
.
Pour en savoir plus, consultez la section Connecter des utilisateurs.
Si l'utilisateur s'est connecté avec un nom d'utilisateur et un mot de passe:
- Une fois que l'utilisateur s'est connecté ou a créé un compte, créez le
PasswordCredential
avec l'ID utilisateur et le mot de passe. - Enregistrez l'objet d'identification à l'aide de
navigator.credentials.store()
.
Pour en savoir plus, consultez Enregistrer des identifiants depuis Forms.
Se déconnecter
Lorsque l'utilisateur se déconnecte, appelez navigator.credentials.preventSilentAccess()
pour l'empêcher d'être automatiquement reconnecté.
La désactivation de la connexion automatique permet également aux utilisateurs de basculer facilement d'un compte à un autre, par exemple entre leur compte professionnel et personnel, ou d'un compte à un autre sur des appareils partagés, sans avoir à saisir à nouveau leurs informations de connexion.
Pour en savoir plus, consultez Se déconnecter.