Aider les utilisateurs à adopter les clés d'accès plus facilement

Eiji Kitamura

Publié le : 9 mai 2025

Les clés d'accès offrent une authentification forte et anti-hameçonnage. Toutefois, l'adoption de ces fonctionnalités par les utilisateurs peut entraîner des frictions. La création automatique de clés d'accès vous permet de créer des clés d'accès pour vos utilisateurs au bon moment, à condition qu'ils aient déjà enregistré un mot de passe pour votre site. La création conditionnelle, qui permet la création automatique de clés d'accès, fait partie de la spécification WebAuthn.

Fonctionnement

Pour aider les utilisateurs à adopter plus facilement les clés d'accès, utilisez une fonctionnalité de l'API WebAuthn appelée Conditional Create (Création conditionnelle). La création conditionnelle permet à votre site de demander une clé d'accès à l'utilisateur sans qu'il ait à effectuer d'action.

Ce flux fonctionne lorsque les conditions suivantes sont remplies :

• L'utilisateur a enregistré un mot de passe dans son gestionnaire de mots de passe par défaut.
• Le mot de passe a été utilisé récemment. Dans l'idéal, appelez Conditional Create immédiatement après une connexion réussie basée sur un mot de passe.

Si les deux conditions sont remplies, vous pouvez demander au gestionnaire de mots de passe de créer une clé d'accès pour l'utilisateur en appelant Conditional Create. Une fois la clé d'accès créée, l'utilisateur reçoit une notification en fonction du gestionnaire de mots de passe.

Compatibilité

La création conditionnelle est compatible avec Safari sur macOS et tous les navigateurs sur iOS, ainsi qu'avec Chrome sur ordinateur et Chrome sur Android.

Implémenter la création conditionnelle

La création automatique de clés d'accès repose sur une fonctionnalité de l'API WebAuthn appelée Conditional Create. Il s'agit de requêtes create() WebAuthn standards avec le paramètre mediation défini sur "conditional", qui fonctionne de la même manière que la saisie automatique de clés d'accès pour les requêtes get().

Utilisez Conditional Create une fois que l'utilisateur s'est connecté avec un mot de passe. La création du mot de passe dépend du gestionnaire de mots de passe et de certaines conditions. Ces conditions peuvent varier selon le gestionnaire de mots de passe et peuvent changer au fil du temps. Par exemple, dans Chrome avec le Gestionnaire de mots de passe de Google (GPM), l'utilisateur doit s'être récemment connecté au site à l'aide d'un mot de passe enregistré.

Si le navigateur crée la clé d'accès, il renvoie un identifiant de clé publique. Envoyez cet identifiant à votre backend pour finaliser l'enregistrement et activer l'authentification future.

Détection des fonctionnalités

Vous pouvez déterminer si Conditional Create est disponible sur le navigateur en appelant PublicKeyCredential.getClientCapabilities(). Vérifiez si un objet renvoyé contient true pour la propriété conditionalCreate.

if (window.PublicKeyCredential && PublicKeyCredential.getClientCapabilities) {
  const capabilities = await PublicKeyCredential.getClientCapabilities();
  if (capabilities.conditionalCreate) {
    // Conditional create is available
  }
}

Si getClientCapabilities n'est pas disponible, la création conditionnelle ne l'est pas non plus.

Créer une clé d'accès de manière conditionnelle

Pour créer automatiquement une clé d'accès, appelez navigator.credentials.create(), mais avec mediation: "conditional" comme suit.

const cred = await navigator.credentials.create({
  publicKey: options,
  // Request conditional creation
  mediation: 'conditional'
});

Vous devez utiliser la création automatique de clés d'accès immédiatement après la connexion de l'utilisateur pour avoir les meilleures chances de répondre aux critères du gestionnaire de mots de passe pour la création automatique.

Vous pouvez envoyer l'identifiant de clé publique obtenu au serveur pour vérifier et enregistrer la clé d'accès. Sur le serveur, assurez-vous que l'utilisateur est connecté.

Mises en garde

La création conditionnelle n'est pas difficile à implémenter en soi, mais il existe plusieurs mises en garde lors de l'intégration de cette fonctionnalité dans un système existant.

Ignorer la présence et la validation de l'utilisateur sur le serveur

La réponse à l'enregistrement renvoie "Présence de l'utilisateur" et "Utilisateur validé" en tant que false. Le serveur doit donc ignorer ces indicateurs lors de la validation des identifiants.

Annuler l'appel WebAuthn en cours avant d'effectuer une création automatique de clé d'accès

Lorsque le RP s'attend à ce que l'utilisateur se connecte avec une clé d'accès ou un mot de passe, l'exécution d'une récupération conditionnelle est le meilleur choix. Cela peut entraîner l'annulation de l'appel GET conditionnel avant l'exécution d'une création conditionnelle.

Pour ce faire, vous devez utiliser AbortController et appeler .abort().

// To abort a WebAuthn call, instantiate an AbortController.
const controller = new AbortController();

const cred = await navigator.credentials.get({
  publicKey: options,
  signal: controller.signal,
  // Request conditional get
  mediation: 'conditional'
});

// Abort the call
controller.abort();

Ignorer les exceptions de manière élégante

Lorsqu'une création conditionnelle de clé d'accès est effectuée, vous devez ignorer les exceptions dans les cas suivants :

• InvalidStateError : une clé d'accès existe déjà chez le fournisseur de clés d'accès (n'oubliez pas de spécifier excludeCredentials).
• NotAllowedError : la création d'une clé d'accès ne remplit pas la condition.
• AbortError : l'appel WebAuthn est annulé.

L'affichage d'erreurs dans ces cas peut dérouter l'utilisateur, car le navigateur les gère en mode silencieux : il n'affiche une notification qu'en cas de succès, et les échecs ne déclenchent pas de messages visibles.

Signal en cas d'échec de l'enregistrement d'une clé d'accès

Lorsqu'une clé d'accès est créée, mais que son enregistrement sur le serveur échoue, l'utilisateur ne parvient pas à se connecter. Cela peut se produire lorsque la liste des clés d'accès n'est pas cohérente entre le fournisseur de clés d'accès et le serveur.

Pour éviter de telles situations, utilisez l'API Signal pour les maintenir cohérentes.

La mise à niveau à partir de connexions sans mot de passe n'est pas prise en charge

À ce stade, la création conditionnelle d'une clé d'accès est subordonnée à la saisie d'un mot de passe valide par l'utilisateur. Cela signifie que les méthodes de connexion sans mot de passe telles que les liens magiques, la validation du numéro de téléphone ou la fédération d'identité ne répondent pas à la condition.

Résumé

La création automatique de clés d'accès peut accélérer leur adoption sur votre site Web, ce qui aide les utilisateurs de votre site Web à passer des mots de passe à une méthode d'authentification plus sécurisée.

Pour en savoir plus sur les clés d'accès, commencez par Connexion sans mot de passe avec des clés d'accès.