À partir de Chrome 93, les sites Web peuvent valider des numéros de téléphone à partir de Chrome pour ordinateur.
WebOTP aide les utilisateurs à saisir un code de validation de numéro de téléphone sur un site Web mobile en d'un simple geste sans avoir à changer d'application. Chrome 93 étend cette fonctionnalité aux pour ordinateur. Pour en savoir plus, poursuivez votre lecture !
Introduction
Les OTP (mots de passe à usage unique) envoyés par SMS sont couramment utilisés pour valider un numéro de téléphone, par exemple comme deuxième étape d'authentification, ou pour valider des paiements sur le Web. Cependant, le passage de l'ordinateur au mobile l'application, la mémorisation et la saisie du mot de passe à usage unique sur le site Web d'origine sur un ordinateur de bureau ajoute des frictions. Il est facile de faire des erreurs de cette façon et il est vulnérable à par hameçonnage.
L'API WebOTP permet aux sites Web de : obtenir par programmation le mot de passe à usage unique à partir d'un SMS et qui remplissent automatiquement le formulaire d'un simple geste, sans changer d'application. Le SMS a un format spécifique et est lié à l'origine, ce qui atténue le risque le risque que des sites d’hameçonnage volent également le mot de passe à usage unique.
<ph type="x-smartling-placeholder">WebOTP ne prend pas encore en charge le ciblage des numéros de téléphone, à partir d'un ordinateur de bureau à distance ou d'un ordinateur portable, L'API ne fonctionne que sur les appareils dotés de fonctionnalités de téléphonie. L'API maintenant prend en charge l'écoute des SMS reçus sur d'autres appareils afin d'aider les utilisateurs à terminer la validation du numéro de téléphone sur ordinateur dans Chrome 93.
<ph type="x-smartling-placeholder">Essayer
Prérequis
- Un ordinateur de bureau ou portable (Windows, Mac, Linux ou ChromeOS)
- Un téléphone Android équipé de la version 20.30.12 ou ultérieure des services Google Play
- Chrome 93 ou version ultérieure, sur ordinateur de bureau ou portable et sur mobile. La version bêta de Chrome 93 est disponible depuis fin juillet 2021.
- Vous devez vous connecter au même compte Google sur l'ordinateur de bureau Chrome et Chrome pour mobile. Par exemple, via https://myaccount.google.com/ ou https://mail.google.com. Il n'est pas nécessaire d'activer la synchronisation.
- Sur votre appareil Android, vous devez vous connecter à Android via Paramètres -> Google.
- Chrome 93 doit être le navigateur par défaut sur l'appareil Android.
- Chrome 93 doit être exécuté au premier plan ou en arrière-plan sur Android appareil.
Démo
Pour tester vous-même ce processus de validation simple du numéro de téléphone sur ordinateur, suivez procédez comme suit:
- Accédez à https://web-otp-demo.glitch.me/ sur ordinateur. Cliquez sur le bouton Valider.
- Envoyez le SMS exact qui s'affiche à l'écran d'un deuxième téléphone vers le un appareil Android.
- Lorsque le SMS est envoyé à l'appareil Android, une boîte de dialogue s'affiche pour vous demander si vous souhaitez valider le numéro de téléphone sur le bureau. Appuyez sur Envoyer pour approuver.
- Sur le bureau, le code de validation envoyé à l'appareil Android doit être saisi automatiquement dans le champ de saisie.
Fonctionnement de l'API WebOTP
Examinons le fonctionnement de l'API WebOTP:
…
const otp = await navigator.credentials.get({
otp: { transport:['sms'] }
});
if (otp.code) input.value = otp.code;
…
Le message SMS doit être formaté avec les codes à usage unique liés à l'origine.
Your OTP is: 123456.
@web-otp-demo.glitch.me #123456
Notez que la dernière ligne contient l'origine à lier à, précédée d'un @
.
suivi du mot de passe à usage unique précédé de #
.
Lorsque vous recevez un SMS, une barre d'informations s'affiche et invite l'utilisateur à
valider son numéro de téléphone. Lorsque l'utilisateur clique sur le bouton Verify
,
le navigateur redirige automatiquement le mot de passe à usage unique vers le site et résout le
navigator.credentials.get()
Le site Web peut alors extraire l'OTP et remplir
la procédure de validation.
Pour en savoir plus, consultez Valider des numéros de téléphone sur le Web avec l'API WebOTP.
Utiliser l'API WebOTP sur un ordinateur de bureau
La validation du numéro de téléphone par SMS est très utilisée et ne dépend pas de la plate-forme. Toute utilisation sur les appareils mobiles doivent s'appliquer aux ordinateurs de bureau.
L'utilisation de l'API WebOTP sur ordinateur fonctionne de la même manière que sur mobile. afin que les sites Web puissent déployer le même code sur toutes les plateformes.
Prise en charge et interopérabilité des navigateurs
Cette fonctionnalité s'appuie sur la synchronisation Chrome. Elle ne fonctionne donc que dans Chrome pour le moment. La réception et la transmission de SMS sur iOS ou iPad OS dans Chrome ne sont pas prises en charge.
Bien que les moteurs de navigateur autres que Chromium n'implémentent pas l'API WebOTP,
Safari partage le même format de SMS.
compatible avec input[autocomplete="one-time-code"]
. Dans Safari, tant qu'un
l'utilisateur a activé la synchronisation automatique d'iMessage lorsqu'il reçoit un SMS contenant
format de code à usage unique arrive avec l'origine correspondante sur iOS ou iPadOS,
est transféré vers macOS. Si l'utilisateur sélectionne le champ de saisie,
proposera à l'utilisateur le mot de passe à usage unique à saisir.
Commentaires
Vos commentaires nous seront très utiles pour améliorer l'API WebOTP. Essayer et contactez-nous ce que vous pensez.
Photo de Luis Villasmil sur Désactiver