از Chrome 93، وب‌سایت‌ها می‌توانند شماره تلفن را از Chrome رومیزی تأیید کنند.
WebOTP به کاربران کمک می کند تا یک کد تأیید شماره تلفن را در یک وب سایت تلفن همراه بدون جابجایی بین برنامه ها با یک ضربه وارد کنند. کروم 93 این قابلیت را به دسکتاپ نیز گسترش می دهد. برای کسب اطلاعات بیشتر به ادامه مطلب مراجعه کنید.
OTPهای پیامکی (گذرواژه های یکبار مصرف) معمولاً برای تأیید یک شماره تلفن، به عنوان مثال به عنوان مرحله دوم در تأیید اعتبار، یا تأیید پرداخت ها در وب استفاده می شوند. با این حال، کل جریان جابجایی از دسکتاپ به موبایل، باز کردن برنامه SMS، به خاطر سپردن و وارد کردن OTP در وب‌سایت اصلی بر روی دسکتاپ باعث ایجاد اصطکاک می‌شود. اشتباه کردن از این طریق آسان است و در برابر حملات فیشینگ آسیب پذیر است.
WebOTP API به وب‌سایت‌ها این امکان را می‌دهد که به صورت برنامه‌ریزی رمز عبور یکبار مصرف را از یک پیام کوتاه دریافت کنند و به‌طور خودکار فرم را برای کاربران تنها با یک ضربه بدون تغییر برنامه پر کنند. پیامک فرمت خاصی دارد و به مبدأ متصل است، بنابراین خطر سرقت OTP توسط وب‌سایت‌های فیشینگ را نیز کاهش می‌دهد.
یکی از موارد استفاده ای که هنوز در WebOTP پشتیبانی نشده است، هدف قرار دادن درخواست های تأیید شماره تلفن از یک دستگاه دسکتاپ راه دور یا یک لپ تاپ است - API فقط روی دستگاه هایی کار می کند که قابلیت های تلفنی دارند. API اکنون از گوش دادن به پیامک های دریافتی در دستگاه های دیگر پشتیبانی می کند تا به کاربران در تکمیل تأیید شماره تلفن در رایانه رومیزی در Chrome 93 کمک کند.
- یک رایانه رومیزی یا لپ تاپ (ویندوز، مک، لینوکس یا ChromeOS).
- یک تلفن Android با خدمات Google Play نسخه 20.30.12 یا بالاتر .
- Chrome 93 یا جدیدتر، هم در دسکتاپ یا لپ تاپ و هم در تلفن همراه. Chrome 93 Beta از اواخر جولای 2021 در دسترس است.
- باید هم در کروم دسکتاپ و هم در کروم موبایل به یک حساب Google وارد شوید. به عنوان مثال، از طریق https://myaccount.google.com/ یا https://mail.google.com . نیازی به روشن کردن همگام سازی نیست.
- در دستگاه Android خود، باید از طریق "Settings->Google" وارد Android شوید.
- Chrome 93 باید مرورگر پیش فرض دستگاه اندروید باشد .
- Chrome 93 باید در پیش زمینه یا پس‌زمینه دستگاه Android اجرا شود.
برای اینکه خودتان این جریان تأیید یکپارچه شماره تلفن را روی دسکتاپ امتحان کنید، این مراحل را دنبال کنید:
- در دسکتاپ به https://web-otp-demo.glitch.me/ بروید. روی دکمه Verify کلیک کنید.
- پیام متنی دقیقی که روی صفحه نمایش بود را از گوشی دوم به دستگاه اندرویدی ارسال کنید.
- هنگامی که پیامک به دستگاه Android تحویل داده می شود، یک گفتگو ظاهر می شود که از شما می پرسد آیا می خواهید شماره تلفن را روی دسکتاپ تأیید کنید یا خیر. برای تایید ، ارسال را فشار دهید.
- در دسکتاپ، کد تأیید ارسال شده به دستگاه Android باید به طور خودکار در قسمت ورودی تکمیل شود.
بیایید نحوه عملکرد WebOTP API را بررسی کنیم:
…
const otp = await navigator.credentials.get({
otp: { transport:['sms'] }
});
if (otp.code) input.value = otp.code;
…
پیام اس ام اس باید با کدهای یکبار مصرف فرمت شده باشد.
Your OTP is: 123456.
@web-otp-demo.glitch.me #123456
توجه داشته باشید که خط آخر حاوی مبدأ است که باید قبل از آن یک @ و سپس OTP با یک # قبل از آن مقید شود.
وقتی پیام متنی می رسد، یک نوار اطلاعات ظاهر می شود و از کاربر می خواهد شماره تلفن خود را تأیید کند. پس از اینکه کاربر روی دکمه Verify کلیک کرد، مرورگر به طور خودکار OTP را به سایت ارسال می کند و navigator.credentials.get() را حل می کند. سپس وب سایت می تواند OTP را استخراج کرده و فرآیند تأیید را تکمیل کند.
در تأیید شماره تلفن در وب با WebOTP API بیشتر بیاموزید.
تأیید شماره تلفن از طریق پیامک به طور گسترده مورد استفاده قرار می گیرد و پلتفرم آگنوستیک است. هر گونه موارد استفاده در دستگاه های تلفن همراه باید برای دستگاه های دسکتاپ قابل اجرا باشد.
استفاده از WebOTP API در دسکتاپ مانند موبایل است، بنابراین وب‌سایت‌ها می‌توانند همان کد را در پلتفرم‌ها مستقر کنند.
این ویژگی توسط Chrome Sync پشتیبانی می‌شود، بنابراین در حال حاضر فقط Chrome کار می‌کند. دریافت و ارسال پیامک در iOS یا iPad OS در Chrome پشتیبانی نمی‌شود.
در حالی که موتورهای مرورگر غیر از Chromium WebOTP API را پیاده‌سازی نمی‌کنند، Safari همان قالب پیامک را با پشتیبانی input[autocomplete="one-time-code"] به اشتراک می‌گذارد. در Safari، تا زمانی که کاربر همگام‌سازی خودکار iMessage را روشن کرده باشد، هنگامی که یک پیامک حاوی فرمت کد یکبار مصرف با مبدأ مطابق با iOS یا iPadOS وارد می‌شود، پیام به macOS ارسال می‌شود. اگر کاربر روی فیلد ورودی تمرکز کند، سافاری OTP را برای ورود به کاربر پیشنهاد می‌کند.
بازخورد شما در بهبود WebOTP API بسیار ارزشمند است. آن را امتحان کنید و نظر خود را با ما در میان بگذارید .
عکس لوئیس ویلاسمیل در Unsplash