אימות מספר טלפון במחשב באמצעות WebOTP API

החל מגרסה 93 של Chrome, אתרים יכולים לאמת מספרי טלפון מ-Chrome למחשב.

Yi Gu

Eiji Kitamura

בעזרת WebOTP משתמשים יכולים להזין קוד אימות של מספר טלפון באתר לנייד בהקשה אחת בלי לעבור בין אפליקציות. בגרסה 93 של Chrome נהנים מהפונקציונליות הזו גם למחשבים שולחניים גם כן. כדי לקבל מידע נוסף, כדאי להמשיך לקרוא.

מבוא

סיסמאות SMS חד-פעמיות (OTP) משמשות בדרך כלל לאימות מספר טלפון, לדוגמה כשלב שני באימות או לאימות תשלומים באינטרנט. עם זאת, כל התהליך של המעבר מהמחשב לנייד ופתיחת ה-SMS האפליקציה, בעל פה והזנה של ה-OTP באתר המקורי במחשב. מוסיף חיכוך. קל לטעות ככה, והיא פגיעה התקפות פישינג.

WebOTP API מאפשר לאתרים להשיג את הסיסמה החד-פעמית באופן פרוגרמטי מהודעת SMS למלא את הטופס באופן אוטומטי עבור משתמשים בהקשה אחת בלבד, מבלי לעבור בין אפליקציות. ל-SMS יש פורמט ספציפי והוא מקושר למקור, כך שהוא מצמצם יש סיכון שאתרי פישינג יגנבו גם את הסיסמה החד-פעמית (OTP).

WebOTP API בפעולה.

תרחיש לדוגמה אחד שעדיין לא נתמך ב-WebOTP הוא טירגוט של מספר טלפון בקשות אימות ממחשב מרוחק או ממחשב נייד – ה-API פועל רק במכשירים עם יכולות טלפוניה. ממשק ה-API תומך בהאזנה להודעות SMS שהתקבלו במכשירים אחרים כדי לסייע למשתמשים להשלים את האימות של מספר הטלפון במחשב באמצעות Chrome 93.

WebOTP API במחשב.

רוצה לנסות?

דרישות מוקדמות

• מחשב נייד או Windows (Windows, Mac, Linux או ChromeOS).
• טלפון Android עם גרסה 20.30.12 של Google Play Services
• Chrome בגרסה 93 ואילך, גם במחשב וגם במחשב נייד וגם בנייד. Chrome 93 בטא זמין החל מסוף יולי 2021.
• עליך להיכנס לאותו חשבון Google גם ב-Chrome במחשב וגם Chrome לנייד. לדוגמה, דרך https://myaccount.google.com/ או https://mail.google.com. אין צורך להפעיל את הסנכרון.
• במכשיר Android, עליך להיכנס אל Android דרך 'הגדרות->Google'.
• Chrome 93 חייב להיות דפדפן ברירת המחדל במכשיר Android.
• דפדפן Chrome 93 צריך לפעול בחזית או ברקע ב-Android במכשיר.

הדגמה (דמו)

כדי לנסות בעצמכם את התהליך החלקי לאימות מספר הטלפון במחשב, יש לפעול לפי את השלבים הבאים:

1. עוברים אל https://web-otp-demo.glitch.me/ מפעילים שולחן עבודה. לוחצים על הלחצן Verify.
2. לשלוח את הודעת הטקסט המדויקת שהופיעה במסך מטלפון שני אל מכשיר Android.
3. כאשר הודעת ה-SMS מועברת למכשיר Android, מופיעה תיבת דו-שיח השואלת אם שרוצים לאמת את מספר הטלפון במחשב. לוחצים על שליחה כדי לאשר.
4. במחשב, קוד האימות שנשלח למכשיר Android אמור להיות מתמלא אוטומטית בשדה להזנת הקלט.

הסבר על WebOTP API

בואו נראה איך WebOTP API פועל:

…
  const otp = await navigator.credentials.get({
    otp: { transport:['sms'] }
  });
  if (otp.code) input.value = otp.code;
…

הודעת ה-SMS צריכה להיות בפורמט של הקודים החד-פעמיים שקשורים למקור.

Your OTP is: 123456.

@web-otp-demo.glitch.me #123456

שימו לב שהשורה האחרונה מכילה את המקור שיש לפניו ב-@ ולאחר מכן ה-OTP מופיע לפני #.

כאשר מתקבלת הודעת טקסט, קופצת סרגל מידע שמבקשת מהמשתמש לאמת את מספר הטלפון שלהם. אחרי שהמשתמש ילחץ על הלחצן Verify, הדפדפן מעביר לאתר באופן אוטומטי את הסיסמה החד-פעמית (OTP) ופותר את הבעיה navigator.credentials.get(). לאחר מכן, האתר יכול לחלץ את ה-OTP ולהשלים אותו תהליך האימות.

מידע נוסף זמין במאמר בנושא אימות של מספרי טלפון באינטרנט באמצעות WebOTP API.

נקודה חשובה: אם ההדגמה לא עובדת לך, כדאי לבדוק את הדברים הבאים: 1. בודקים שוב שכל הדרישות המוקדמות עומדות. 2. אם מספר הטלפון של השולח נמצא ברשימת אנשי הקשר של הנמען, הודעת ה-SMS לא תפעיל את תיבת הדו-שיח של WebOTP כי עיצוב. יש לנסות עם מספר טלפון אחר. 3. אם הבעיה נמשכת, צריך לפתוח את chrome://sync-internals ב-Android Chrome שמקבל את הודעת ה-SMS, לוחצים על הפסקת הסנכרון ואז על בקשת התחלה כדי להפעיל מחדש את הסנכרון.

איך משתמשים ב-WebOTP API במחשב

אימות של מספר טלפון באמצעות SMS נמצא בשימוש נרחב והוא לא תלוי משתמשים בפלטפורמות. כל שימוש כיסויים של מכשירים ניידים צריכים להיות רלוונטיים למחשבים.

השימוש ב-WebOTP API במחשב זהה לשימוש בנייד, כדי שאתרים יוכלו לפרוס את אותו הקוד בפלטפורמות שונות.

תמיכה בדפדפן ויכולת פעולה הדדית

התכונה הזו מופעלת על ידי סנכרון Chrome כך שהיא פועלת ב-Chrome רק באותו רגע. אין תמיכה בקבלת ובשידור של SMS ב-iOS או ב-iPad ב-Chrome.

מנועי דפדפנים שאינם Chromium לא מיישמים את WebOTP API, פורמט ה-SMS משותף ל-Safari עם התמיכה ב-input[autocomplete="one-time-code"]. ב-Safari, כל עוד המשתמש הפעיל את הסנכרון האוטומטי של iMessage, כשהודעת SMS שמכילה אל מקור בפורמט קוד חד-פעמי מגיע עם המקור התואם ב-iOS או ב-iPadOS, ההודעות מועברות ל-macOS. אם המשתמש מתמקד בשדה להזנת הקלט, Safari יציע למשתמש להזין את ה-OTP.

משוב

המשוב שלך חיוני לשיפור WebOTP API. אני רוצה לנסות ולהודיע לנו מה אתם חושבים.

צילום: Luis Williamsmil על ביטול הפתיחה