星期二, 3月 03, 2020

筆記:以適合的 HTML 屬性增強輸入 2FA 的體驗

來源:HTML attributes to improve your users’ two factor authentication experience
TL;DR
  1. type 維持在 text
  2. inputmode 改為 numeric,這樣可以在手機平台上出現數字鍵盤,而不是完整的鍵盤
  3. pattern 設為 [0-9]* ,可以確保輸入的文字是數字
  4. autocomplete 設為 one-time-code ,是可以確定自動完成的部份是「一次性的密碼」,之前以為只有 “off” ,其他可以用的數值可以參考這篇
<input
  type="text"
  name="token"
  id="token"
  inputmode="numeric"
  pattern="[0-9]*"
  autocomplete="one-time-code"
/>

沒有留言: