おはようございます ritou です。 8月ですよ。お仕事の進捗大丈夫ですか？ 最近、Google方面からDecoupled AuthNの香りがしたので追ってみました。
何の話?
この話です。
WebOTPとは?
Webアプリケーションがモバイル端末でSMS経由のOTP認証をしようと思った時、画面に「認証コードを送信しました」なんて出た後にSMSを確認できるアプリを起動して確認してまたブラウザに...とかをやったことがある人は多いでしょう。 WebOTPとは、モバイル端末上のブラウザであればアプリの切り替えをせずにワンタップでSMSで受け取ったOTPの値を読み込んで検証リクエストに繋げられる、しかもSMSを発信したWebアプリを特定できるフォーマットになっていることでフィッシングサイトからはこのフローを使えなくするような仕組みのことです。
Cross Device WebOTPとは?
Desktop(PC) ブラウザとモバイルブラウザで同じユーザーでログインしていたら、Desktop側のブラウザでWebOTPのシームレスなフローを実現できる仕組みのことです。
細かい話は以下のドキュメントに書いてあります。
どんな動きをするかと言うと、
- ユーザーがPCのChromeでSMS検証フローを開始
- WebアプリはWebOTPに対応したOTP入力フォームを表示しつつSMS送信
- SMSを受け取ったAndroid端末で動いているChromeがOTPを取得、ユーザーの許可を得た上でPCのブラウザに送信
- PCのChromeでOTPが自動入力されて処理を継続
と言う流れで、"手元のAndroidでOTPを受け取ってPCに送り、PCブラウザでSMS検証が完了できる" のが特徴です。
試した
デモのやり方が書いてあります。
準備
- PCブラウザとしてChrome 93以降を用意する(私はChrome betaを用意しました。)
- Google Play Service のバージョンが 20.30.12 より上のAndroid端末を用意し、こちらもChrome betaを入れる
- Android端末の設定でChrome betaを規定のブラウザに設定する
- どちらの環境でもGmailなどを開き、同一ユーザーでログインする
- 念のため再起動する(ある人から聞いたおまじない)
デモサイトの使い方
デモページを開きます。
Send following SMS message to this phone from another one after pressing "Verify".
とあって
Your OTP is: 123456. @web-otp-demo.glitch.me #123456
と書いてあるので、"Verify" を押したらターゲットとなるAndroid端末に向けて別の端末からSMSを送ったり、Twilioの無料枠を使ったりしてSMSを送信します。
あとは入力フォームのまま、PCブラウザでは待ってれば良いです。 AndroidにSMSが届くと、PCブラウザにOTPを送っても良いか？と聞く通知が来るので「送信」を押すと、PCブラウザの画面でOTPが入力されたようになって検証成功します。
成功したときのPC側の画面を録画したものを含むTweetを載せておきます。
できたできた！
— 👹秋田の猫🐱 (@ritou) 2021年7月31日
1. PCのChrome BetaでOTPフロー開始
2. Androidに通知がきて送信って押す
3. PCのChromeにOTPが送られて成功！
バージョン低めのAndroidでも普通に動いた！ pic.twitter.com/hHDLdEwEgO
Androidへの通知はこんな感じ。 pic.twitter.com/1Xz9U1iJV7
— 👹秋田の猫🐱 (@ritou) 2021年7月31日
いかがでしたか？ 今までのOTPの認証フローがChromeのサポートにより Decoupled AuthN へと進化してしまっています。
何がすごいのか
個人的には
- 互換性を保ちながら便利に使える人が増えること
- OTPの認証フローを使っているサービスであれば誰でも使えること(そう、Googleユーザーならね)
と言う2点で、Googleさんすごいなって思います。
前者について、新しい認証フローみたいなのを考える場合「対応していない環境」をどうするかが課題になります。 WebAuthnの場合は関数の利用可否をもとに「導線を出さない」みたいな実装がされたりするでしょう。 それに対して今回のはこれまでのOTPのフローを拡張したものです。環境によって
- SMSを受け取れる端末上のブラウザならば : OTP取得をスムーズに実現可能
- PCブラウザでもSMSを受け取れるAndroid端末で同一のGoogleユーザーでログインしていたら : OTPを送信してスムーズに利用可能
- どちらでもなかったら普通のOTPフロー
と言うように、WebOTPに対応しているだけでWebアプリ開発者が意識しないところで "勝手に" 便利にできるわけです。 これは良いですね。(ユーザーサポートと言う点ではパターンが複雑になる面倒さもあるかもしれません。)
後者については、これがGoogleにログインするため"だけ"のものではないということです。 WebOTPを導入している全てのサービスがこの恩恵を受けられる可能性があります。 ちょっと前にAppleがWebAuthnを拡張して便利にするぞ〜みたいな話を書きましたが、広い意味では似たような感じですね。
今後もプラットフォームやブラウザによる便利な実装が話題になったらチェックしてみたいと思います。 ではまた！
