A partir de Chrome 93, los sitios web pueden verificar los números de teléfono desde la versión de Chrome para computadoras de escritorio.
WebOTP ayuda a los usuarios a ingresar un código de verificación de número de teléfono en un sitio web móvil en con solo presionar una vez sin tener que pasar de una app a otra. Chrome 93 extiende esta funcionalidad a para computadoras de escritorio. Sigue leyendo para obtener más información.
Introducción
Las OTP (contraseñas de un solo uso) por SMS se usan comúnmente para verificar un número de teléfono, por por ejemplo, como segundo paso en la autenticación o para verificar pagos en la Web. Sin embargo, todo el flujo de cambio de la computadora a un dispositivo móvil y abrir el SMS app, memorizando e ingresando la OTP en el sitio web original nuevamente en la computadora agrega fricción. Es fácil cometer errores de esta forma y es vulnerable a ataques de phishing.
La API de WebOTP les brinda a los sitios web la capacidad de realizar las siguientes acciones: obtener la contraseña de un solo uso de un mensaje SMS de forma programática y completará automáticamente el formulario para los usuarios con solo un toque, sin cambiar de aplicación. El SMS tiene un formato específico y está vinculado al origen, por lo que mitiga el de que los sitios web de phishing también roben la OTP.
Un caso de uso que todavía no se admite en WebOTP es el de segmentación a números de teléfono. de verificación desde un dispositivo de escritorio remoto o una computadora portátil, La API solo funciona en dispositivos que tienen capacidades de telefonía. Ahora, la API admite la escucha de SMS recibidos en otros dispositivos para ayudar a los usuarios a completar la verificación del número de teléfono en computadoras de escritorio en Chrome 93.
Probar
Requisitos previos
- Una computadora de escritorio o laptop (Windows, Mac, Linux o ChromeOS)
- Un teléfono Android con la versión 20.30.12 o una posterior de los Servicios de Google Play
- Chrome 93 o versiones posteriores, en computadoras de escritorio, laptops y dispositivos móviles. Chrome 93 Beta está disponible desde finales de julio de 2021.
- Debes acceder a la misma Cuenta de Google en la versión de Chrome para computadoras y Chrome para dispositivos móviles. Por ejemplo, mediante https://myaccount.google.com/ o https://mail.google.com. No es necesario activar la sincronización.
- En tu dispositivo Android, debes acceder a Android a través de "Configuración->Google".
- Chrome 93 debe ser el navegador predeterminado en el dispositivo Android.
- Chrome 93 debe ejecutarse en primer o segundo plano en Android dispositivo.
Demostración
Para probar por tu cuenta este sencillo flujo de verificación del número de teléfono en una computadora, sigue estos pasos:
- Ve a https://web-otp-demo.glitch.me/ en una computadora de escritorio. Haz clic en el botón Verificar.
- Envía el mensaje de texto exacto que apareció en pantalla desde un segundo teléfono al dispositivo Android.
- Cuando se entrega el SMS al dispositivo Android, aparece un diálogo en el que se pregunta si verificar el número de teléfono en la computadora de escritorio. Presiona Enviar para aprobar.
- En el escritorio, el código de verificación enviado al dispositivo Android debe ser que se autocompletan en el campo de entrada.
Cómo funciona la API de WebOTP
Veamos cómo funciona la API de WebOTP:
…
const otp = await navigator.credentials.get({
otp: { transport:['sms'] }
});
if (otp.code) input.value = otp.code;
…
El mensaje SMS debe tener el formato correspondiente a los códigos únicos vinculados al origen.
Your OTP is: 123456.
@web-otp-demo.glitch.me #123456
Observa que la última línea contiene el origen que se vinculará para que aparezca precedido por un @
.
seguida de la OTP precedida por #
.
Cuando llega el mensaje de texto, aparece una barra de información y se le pide al usuario que
verificar su número de teléfono. Después de que el usuario hace clic en el botón Verify
, el
navegador reenvía automáticamente la OTP al sitio y resuelve el
navigator.credentials.get()
El sitio web puede extraer la OTP y completar
el proceso de verificación.
Obtén más información en Verifica números de teléfono en la Web con la API de WebOTP.
Cómo usar la API de WebOTP en computadoras de escritorio
La verificación del número de teléfono por SMS se usa mucho y es independiente de la plataforma. Cualquier uso casos en dispositivos móviles deben ser aplicables a los dispositivos de escritorio.
El uso de la API de WebOTP en computadoras de escritorio es lo mismo que en dispositivos móviles, para que los sitios web puedan implementar el mismo código en todas las plataformas.
Interoperabilidad y compatibilidad con navegadores
Esta función cuenta con la tecnología de la Sincronización de Chrome, por lo que solo funciona en Chrome en este momento. No se admite la recepción y la transmisión de SMS en iOS o el sistema operativo de iPad en Chrome.
Si bien los motores de navegador distintos de Chromium no implementan la API de WebOTP,
Safari comparte el mismo formato de SMS
compatible con input[autocomplete="one-time-code"]
. En Safari, siempre que un
usuario activó la sincronización automática de iMessage, cuando un SMS que contenga
que llega con el origen coincidente en iOS o iPadOS, el
el mensaje se reenvía a macOS. Si el usuario se enfoca en el campo de entrada, Safari
sugerirá la OTP que debe ingresar el usuario.
Comentarios
Tus comentarios son muy importantes para mejorar la API de WebOTP. Pruébalo y comunícanoslo. lo que piensas.
Foto de Luis Villasmil activado Eliminar salpicaduras