WebOTP API は、特別な形式の SMS メッセージの受信時にワンタイムパスワードを生成することで、電話番号がユーザーのものであることを検証する方法を提供します。 電話番号はアプリケーションがユーザーを識別する方法としてよく使用され、番号がユーザーのものであることを検証するため、SMS がよく使用されます。通常のシナリオでは、ユーザーにワンタイムパスワードを含むメッセージが送信されます。そして、ユーザーはこのパスワードを、番号がユーザーのものであることを検証するフォームにコピペしなければならないでしょう。 WebOTP API は、アプリケーションがパスワードをコピペなしで自動で受信して検証することを可能にし、この手続きで生じるイライラを解消します。
今度は「WebOTP」についてFrontend Weekly LT（社内勉強会）でお話しました - BASEプロダクトチームブログ
はじめましての人ははじめまして、こんにちは！フロントエンドエンジニアのがっちゃん（ @gatchan0807 ）です。 今回は社内勉強会 Frontend Weekly LT にて、WebOTP / OTPの概要と使い方について発表をしたので、その内容を皆さまにも共有できればと思って記事にしました。 （以前、同じように社内勉強会での発表内容が記事化された 「Frontend Weekly LT（社内勉強会）で「Vite」について LT しました」の記事もぜひどうぞ） 元々、BASEのどこかに使えないかなぁと思って個人的に調べていた内容を社内共有用にまとめたものなので一部 web.dev の記事をなぞっただけの部分もあるのですが、その内容と共にBASEでのOTPの使い方やWebOTPの利用状況についてのシェアしていければと思います。 イントロ Chrome 93から新機能が追加され、Andr
Chrome 93で実装されたCross Device WebOTPフローを試してみた - r-weblife
おはようございます ritou です。 8月ですよ。お仕事の進捗大丈夫ですか？ 最近、Google方面からDecoupled AuthNの香りがしたので追ってみました。 何の話? この話です。 developer.chrome.com WebOTPとは? Webアプリケーションがモバイル端末でSMS経由のOTP認証をしようと思った時、画面に「認証コードを送信しました」なんて出た後にSMSを確認できるアプリを起動して確認してまたブラウザに...とかをやったことがある人は多いでしょう。 WebOTPとは、モバイル端末上のブラウザであればアプリの切り替えをせずにワンタップでSMSで受け取ったOTPの値を読み込んで検証リクエストに繋げられる、しかもSMSを発信したWebアプリを特定できるフォーマットになっていることでフィッシングサイトからはこのフローを使えなくするような仕組みのことです。 web.
Verify phone numbers on the web with the WebOTP API | Identity | Chrome for Developers
What is the WebOTP API? These days, most people in the world own a mobile device and developers are commonly using phone numbers as an identifier for users of their services. There are a variety of ways to verify phone numbers, but a randomly generated one-time password (OTP) sent by SMS is one of the most common. Sending this code back to the developer's server demonstrates control of the phone n
Fill OTP forms within cross-origin iframes with WebOTP API Stay organized with collections Save and categorize content based on your preferences. SMS OTPs (one-time passwords) are commonly used to verify phone numbers, for example as a second step in authentication, or to verify payments on the web. However, switching between the browser and the SMS app, to copy-paste or manually enter the OTP mak
Googleは8月31日(現地時間)、デスクトップ版Chromeブラウザの最新版「Chrome 93」をリリースしました(Chrome Releases、Neowin)。 Chrome 93.0.4577.63では、深刻度Highの脆弱性5件を含む合計27件の脆弱性が修正されています。セキュリティ関連の修正の詳細はChromium Security Pageで確認可能です。 Chrome 93では、TLS(Transport Layer Security)における3DES暗号ブロックチェイニング(CBC)のサポートが廃止されました。Googleは過去数十年の間にAESベースのより優れた代替品が登場しているとし、3DESは、Sweet32攻撃にも弱く、特にモバイルプラットフォームでは動作が非常に遅く、バッテリーを消費し、CPUに負荷がかかると削除した理由を説明しています。またALPACA攻撃
・@以降は対応するドメイン、#以降はワンタイムパスワード iOS と Android ・iOS: OSでサポートしていて自動的に入力まで行われる。特に対応はいらない。 ・Android: 日本語SMSメッセージでは自動では行われない様子。スクリプトで対応。 Chrome on Android 用スクリプト <script> if ('OTPCredential' in window) { window.addEventListener('DOMContentLoaded', function(e) { var input = document.querySelector('input[autocomplete="one-time-code"]'); if (!input) return; var ac = new AbortController(); var form = input.cl
WebOTP API を使用してウェブ上で電話番号を確認する | Identity | Chrome for Developers
WebOTP API とは 最近では、世界中のほとんどの人がモバイル デバイスを所有しており、デベロッパーはサービス ユーザーの識別子として電話番号を使用するのが一般的です。 電話番号の確認にはさまざまな方法がありますが、SMS によってランダムに生成されるワンタイム パスワード（OTP）が最も一般的な方法の 1 つです。このコードをデベロッパーのサーバーに送信すると、電話番号を制御することができます。 この考え方はすでに多くのシナリオで採用されており、 ユーザーの ID としての電話番号。ウェブサイトによっては、新しいサービスに登録する際に、メールアドレスではなく電話番号を尋ねて、アカウント ID として使用することがあります。 2 段階認証プロセス。ウェブサイトはログイン時に、セキュリティを強化するため、パスワードなどの知識要素に加えて、SMS でワンタイム コードを SMS で送信す
Webにおいて、二要素認証やアカウント復旧のためにSMSでワンタイムパスワードを発行し、フォームに入力させる事がある。 ユーザはSMSで送られたきたワンタイムパスワードをコピー&ペーストなり手入力することになる。 端末(電話番号)の所持確認をより自動的に行えるように、「SMS Receiver API」という機能がChromeの開発者メーリングリスト(Blink-dev)で議論されている。(AndroidのSMS Retriever APIをもとにしている) 提案自体は、下記URLにある。 https://github.com/samuelgoto/sms-receiver Demo Githubリポジトリ上にあるgitアニメーションがわかりやすい。幾つか検討案があり、オプトアウト をするかや、モーダルを出すかの違いがある。 ユーザは電話番号を入力する (もしくは候補から選択する) 電話番
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WebOTP API - Web API | MDN
Fill OTP forms within cross-origin iframes with WebOTP API | Articles | web.dev
Google Chrome 93 リリース - WebOTPのクロスデバイスサポートやCSS Module Scriptsなど
Chrome 93がリリース - WebOTPのサポートなど | ソフトアンテナ
【JavaScript】WebOTP API で UI/UX を向上させる - Qiita
WebのSMS Receiver API (WebOTP API) - Qiita