A partire da Chrome 93, i siti web possono verificare i numeri di telefono dalla versione desktop di Chrome.
WebOTP consente agli utenti di inserire un codice di verifica del numero di telefono su un sito web mobile in un solo tocco senza passare da un'app all'altra. Chrome 93 estende questa funzionalità a computer fisso. Per saperne di più, continua a leggere quanto segue.
Introduzione
Le OTP via SMS (password monouso) vengono comunemente utilizzate per verificare un numero di telefono, ad esempio come secondo passaggio per l'autenticazione o per verificare i pagamenti sul web. Tuttavia, l'intero flusso per il passaggio dal computer ai dispositivi mobili, l'apertura degli SMS all'app, memorizzando e inserendo l'OTP sul sito web originale, di nuovo sul desktop crea un maggiore attrito. È facile commettere errori in questo modo ed è vulnerabile attacchi phishing.
L'API WebOTP offre ai siti web la possibilità di ottenere in modo programmatico la password monouso da un SMS e compilare automaticamente il modulo per gli utenti con un solo tocco senza cambiare app. L'SMS ha un formato specifico ed è associato all'origine, quindi mitiga anche il rischio che i siti web di phishing rubino l'OTP.
Un caso d'uso che deve essere ancora supportato in WebOTP ha come target il numero di telefono richieste di verifica da un computer fisso o un laptop, L'API funziona solo su dispositivi dotati di funzionalità di telefonia. L'API ora supporta l'ascolto di SMS ricevuti su altri dispositivi per assistere gli utenti nel completare la verifica del numero di telefono da computer in Chrome 93.
Prova
Prerequisiti
- Un computer desktop o laptop (Windows, Mac, Linux o ChromeOS).
- Uno smartphone Android con Google Play Services 20.30.12 o versioni successive.
- Chrome 93 o versioni successive, sia su computer che su laptop e dispositivi mobili. Chrome 93 beta è disponibile dalla fine di luglio 2021.
- Devi accedere allo stesso Account Google sia su Chrome per il computer desktop sia su Chrome per dispositivi mobili. Ad esempio, tramite https://myaccount.google.com/ oppure https://mail.google.com. Non è necessario attivare la sincronizzazione.
- Sul tuo dispositivo Android, devi accedere ad Android tramite "Impostazioni->Google".
- Chrome 93 deve essere il browser predefinito sul dispositivo Android.
- Chrome 93 deve essere in esecuzione in primo piano o in background su Android dispositivo.
Demo
Per provare personalmente questa procedura di verifica del numero di telefono da computer, segui questi passaggi:
- Vai a https://web-otp-demo.glitch.me/ su desktop. Fai clic sul pulsante Verifica.
- Invia l'esatto SMS presente sullo schermo da un secondo smartphone al Dispositivo Android.
- Quando l'SMS viene recapitato al dispositivo Android, viene visualizzata una finestra di dialogo che chiede se vuoi verificare il numero di telefono sul computer. Premi Invia per approvare.
- Su computer, il codice di verifica inviato al dispositivo Android dovrebbe essere compilate automaticamente nel campo di immissione.
Come funziona l'API WebOTP
Vediamo come funziona l'API WebOTP:
…
const otp = await navigator.credentials.get({
otp: { transport:['sms'] }
});
if (otp.code) input.value = otp.code;
…
Il messaggio SMS deve essere formattato con i codici monouso associati all'origine.
Your OTP is: 123456.
@web-otp-demo.glitch.me #123456
Tieni presente che l'ultima riga contiene l'origine da associare, preceduta da @
seguito da OTP preceduta da #.
Quando arriva l'SMS, appare una barra delle informazioni che chiede all'utente di
verificare il proprio numero di telefono. Dopo che l'utente fa clic sul pulsante Verify, il
il browser inoltra automaticamente l'OTP al sito e risolve il problema
navigator.credentials.get(). Il sito web può quindi estrarre l'OTP e completare
la procedura di verifica.
Per saperne di più, vedi Verificare i numeri di telefono sul web con l'API WebOTP.
Come utilizzare l'API WebOTP su computer
La verifica del numero di telefono tramite SMS è ampiamente utilizzata e indipendente dalla piattaforma. Qualsiasi uso per dispositivi mobili dovrebbero essere applicabili ai computer.
L'utilizzo dell'API WebOTP su computer è lo stesso che su mobile, in modo che i siti web possano eseguire il deployment dello stesso codice su più piattaforme.
Supporto del browser e interoperabilità
Questa funzionalità è basata sulla funzionalità Sincronizzazione Chrome, pertanto al momento funziona solo con Chrome. La ricezione e la trasmissione di SMS su iOS o iPad OS in Chrome non sono supportate.
Anche se i motori dei browser diversi da Chromium non implementano l'API WebOTP,
Safari condivide lo stesso formato SMS
con il relativo supporto input[autocomplete="one-time-code"]. In Safari, a condizione che
l'utente ha attivato la sincronizzazione automatica di iMessage quando un SMS contiene un messaggio
formato del codice monouso arriva con l'origine corrispondente su iOS o iPadOS,
viene inoltrato a macOS. Se l'utente si concentra sul campo di immissione, Safari
suggerisce l'OTP che l'utente può inserire.
Feedback
Il tuo feedback è inestimabile per migliorare l'API WebOTP. Prova e comunicacelo quello che pensi.
Foto di Luis Villasmil attivo Rimuovi schermo