WebOTP

Phone verification normally costs the user a trip out of your page: read the SMS, memorize six digits, come back, type them. WebOTP removes the trip. navigator.credentials.get({ otp: { transport: ['sms'] } }) (Credential Management) returns a promise that stays pending until a matching SMS arrives; the browser asks once whether to use it, and the resulting OTPCredential carries the digits in code. The match is on the message, not the sender: the browser reads only the last line, which must be @trailnotes.example #123456 — @ plus the host of your origin with no scheme, port or path, a space, # plus the code. A cross-origin iframe appends its own origin (@top.example #123456 @embed.example) and needs otp-credentials from the embedder (Permissions Policy).

Filling a one-time-code field from an SMSJavaScript

const input = document.querySelector('input[autocomplete="one-time-code"]');
const form = input.closest('form');
if ('OTPCredential' in window) {
  const ac = new AbortController();
  form.addEventListener('submit', () => ac.abort());  // the user typed it first
  setTimeout(() => ac.abort(), 60_000);               // never leave the prompt standing
  const options = { otp: { transport: ['sms'] }, signal: ac.signal };
  try {
    input.value = (await navigator.credentials.get(options)).code;
    form.requestSubmit();                             // still verify the code server-side
  } catch (err) {
    if (err.name !== 'AbortError') console.warn(err.name);   // declined, or timed out
  }
}

There is no output to show: the call needs a real SIM, a real message and a tap on the browser's prompt, none of which a headless run can supply. Test it on a device, or through ADB port forwarding to localhost.

The autocomplete="one-time-code" attribute the code queries for is the half that works everywhere: Safari 10 , iOS and Android autofill offer the digits above the keyboard from this exact message format, so ship the attribute first and treat the API as the enhancement. WebOTP is Baseline limited — Chrome 1 for Android 84, Chrome and Edge 93 on desktop, which read the message from a signed-in Android phone; Firefox 555 and Safari have no OTPCredential. It needs a secure context and a top-level document, and it shortens the typing, not the risk: SMS codes are phishable, so prefer passkeys (WebAuthn and Passkeys) for account access.

MENU