Permettre aux visiteurs d’activer la connexion en deux étapes
Objectif
Permettre à une personne qui se connecte à votre portail d’activer la connexion en deux étapes : une application d’authentification sur son téléphone, à laquelle un code à six chiffres est demandé à chaque connexion.
Avant de commencer
- Un portail qui demande aux visiteurs de se connecter. Voir Demander aux visiteurs de se connecter.
Tout tient en un bouton
Dessinez un bouton sur n’importe quel écran de votre portail et donnez-lui ce gestionnaire :
openAccountSecurity();
C’est tout. La plateforme ouvre son propre panneau par-dessus votre page, et le visiteur scanne un code, saisit six chiffres et enregistre ses codes de récupération sans que vous ayez rien dessiné.
Ou dessinez-le vous-même
Si vous préférez que la page ressemble au reste de votre site, dessinez votre propre écran — derrière la connexion, puisqu’il concerne le compte du visiteur — et donnez-lui ces appels, dans cet ordre :
| Quand | Appel |
|---|---|
| L’écran se charge | loadAccountSecurity("mfa") — state.mfa.enabled indique si elle est activée |
| On appuie sur L’activer | startAuthenticator("enrol") |
| On appuie sur Vérifier le code | verifyAuthenticator(getState("code"), "codes") |
| On appuie sur Je les ai enregistrés | completeAuthenticator("done") |
| On appuie sur La désactiver | disableAuthenticator(getState("offCode")) |
- Le code QR est
state.enrol.qrCode— ajoutez une image et liez-y sa source. Placezstate.enrol.sharedKeyà côté pour ceux dont l’appareil photo ne parvient pas à lire le code. - Les codes de récupération arrivent dans
state.codessous forme de liste ; répétez une ligne dessus qui afficherow.code. - La connexion en deux étapes n’est activée qu’après
completeAuthenticator. Vérifier le code prouve seulement que l’application fonctionne. Affichez donc les codes avec une phrase demandant au visiteur de les enregistrer maintenant — ils ne seront plus affichés — et un bouton confirmant qu’il l’a fait. Si votre page oubliait cette étape, le facteur resterait simplement désactivé au lieu d’être activé avec des codes que personne n’a vus.
Le code QR est dessiné dans le navigateur du visiteur ; il n’est jamais envoyé nulle part pour être converti en image, car il transporte le secret qu’utilisera son application.
L’exemple portal-landing-page propose cela sur son écran Sign-in security.
Ce que voit le visiteur
Le panneau indique comment son compte est configuré, et propose la seule action disponible :
| Son compte | Ce que propose le panneau |
|---|---|
| Connexion en deux étapes désactivée | Activer la connexion en deux étapes — scanner, prouver, enregistrer les codes |
| Connexion en deux étapes activée | Le nombre de codes de récupération restants, et une zone pour la désactiver avec un code actuel |
L’ordre est : scanner → prouver → noter les codes, et le facteur n’est activé qu’une fois les codes confirmés. Quelqu’un qui ferme l’onglet à mi-chemin n’a rien changé à son compte, et c’est tout l’intérêt de procéder en trois étapes plutôt qu’en une.
La désactiver exige un code
Un visiteur peut désactiver sa propre connexion en deux étapes — c’est son compte — mais uniquement en saisissant un code actuel, ou l’un de ses codes de récupération. C’est voulu : désactiver un second facteur est exactement ce que ferait quelqu’un qui aurait volé une session.
Les personnes qui se connectent au Shell Parsware et au Centre de contrôle d’administration doivent disposer d’un second facteur, et se voient proposer un moyen de le transférer sur un nouveau téléphone à la place. C’est une décision qui concerne l’interface détenant les enregistrements de tous les clients ; ce n’est pas une décision que nous prenons à la place de vos clients.
Ce qui se passe à la connexion suivante
Rien que vous ayez à dessiner. Le formulaire de connexion de la plateforme demande lui-même le code, à côté de l’adresse et du mot de passe, et accepte un code de récupération dans la même zone — un code de récupération ne comporte pas six chiffres, la plateforme sait donc lequel elle reçoit.
Si vous avez dessiné votre propre page de connexion, elle a
besoin d’une zone de code qui apparaît lorsque signIn indique que le compte en demande une —
cette page explique comment.
Ce que cela ne fait pas
- Cela ne transfère pas une application d’authentification vers un nouveau téléphone en une seule étape. Un visiteur qui n’a plus son téléphone désactive le facteur avec un code de récupération et le réactive, ce qui représente une étape de plus sans rien perdre.
- Cela n’impose rien à personne. La connexion en deux étapes est proposée à vos visiteurs, jamais exigée. Si votre portail doit l’exiger, c’est une discussion à avoir avec nous plutôt qu’un écran à dessiner.
- Cela ne fait rien sur un portail que tout le monde peut ouvrir. Il n’y a aucun compte auquel un second facteur pourrait appartenir : le bouton le signale au lieu de faire semblant de fonctionner.
Essayer
La solution d’exemple portal-sign-in-and-accounts propose cela sur
un écran nommé Sign-in security, avec une page How this sample works qui en fait la visite.