📲

Passkey's Tips: モバイル端末を使ってPCにログインしたらその端末のパスキー登録に誘導する

2023/10/06に公開

ritou です。

パスキーに関するTips始めました

https://zenn.dev/ritou/scraps/65f903a751eb7f

今回の内容

Apple, Google, Microsoftがパスキーパスキー言い出した時、FIDOアライアンスがこんな動画を出していました。みたことある方もいらっしゃるかもしれません。

https://www.youtube.com/watch?v=SWocv4BhCNg

この後半で、Android端末のパスキーを用いてWindows PCのブラウザでサービスにログインして、その直後にWindows Helloでもパスキーを登録するっていう流れが説明されています。

同じように、Android端末のパスキーを用いてMacOSのSafariでサービスにログインして、その直後にiCloud Keychainでもパスキーを登録するっていう流れも説明されています。

今でこそ1Passwordとかでクロスプラットフォームのパスキー利用が実現できそうなものの、最初の頃の「え?プラットフォームを超えた同期はできないの?そりゃそうか」と言う段階においては「ほーん、なるほど。こうしたら次からはPC端末のローカル認証でできて楽と。今できるのはこれぐらいだよな。」みたいなやつです。

この記事では、これを実装したいときにどうしたらいいのか?と言うところをまとめました。

処理の流れ

仕様をみてみましょう。(Level 2の仕様でも今回の話に関連する内容は同じです)

https://www.w3.org/TR/webauthn-3/

まずは、認証に成功したパスキーがHybridだったことを判定する必要があります。
これには "Authenticator Attachment" が利用できるでしょう。

navigator.credentials.get() の戻りに authenticatorAttachment の値が含まれます。

Chrome@MacOS, 1Passwordなどを使った場合は platform になります。

PublicKeyCredential {
  rawId: ArrayBuffer(32),
  response: AuthenticatorAssertionResponse,
  authenticatorAttachment: 'platform',
  id: 'I_pzZH0XJhLiaj-y7JqJzJLSNCZzyQS3OUKD4BWZ5A4',
  type: 'public-key'
}

Hybrid Transportを使ってモバイル端末のPasskeyを利用した場合、 cross-platform となります。

PublicKeyCredential {
  rawId: ArrayBuffer(16), 
 response: AuthenticatorAssertionResponse,
 authenticatorAttachment: 'cross-platform',
 id: 'KUZDcRAeRRvnglHwUGOkvQ',
 type: 'public-key'
 }

仕様にも記載されていますね。

Some platform authenticators could possibly also act as roaming authenticators depending on context. For example, a platform authenticator integrated into a mobile device could make itself available as a roaming authenticator via Bluetooth. 
In this case clients running on the mobile device would recognise the authenticator as a platform authenticator, 
while clients running on a different client device and communicating with the same authenticator via Bluetooth would recognize it as a roaming authenticator.

あとは、"Platform Authenticator" を用いたパスキー登録ができるかどうかを判定できれば良さそう。

その下に "5.1.8. Availability of a passkey platform authenticator - PublicKeyCredential’s isPasskeyPlatformAuthenticatorAvailable() Method" と言うのも定義されていますが、こちらは Hybrid Transport を含むもののようなので前からあるこっちの方が適切な気がします。

この結果を見て、「この端末でもパスキー作っておかないか?」みたいに誘導して "authenticatorAttachment: 'platform'" を指定してパスキーの生成を要求する流れに続ければ良さそうです。

フローを図にするとこんな感じです。

まとめ

初めて利用するプラットフォームの端末など、パスキーが同期されない環境において、モバイル端末を利用したことを判定してその端末でのパスキー登録を行うように誘導するための判定方法をまとめました。

RP(サービス)側で「ここでパスキーを登録したことがあるか」みたいな値をCookieなどを用いて持ったり判定したりが必要だったらだるいなと思っていましたが、WebAuthnの仕様だけである程度できそうなことがわかって安心しました。

PC/モバイル両方でサービスを展開している、もしくは利用される可能性のあるID基盤であれば実サービスで使える機能であると思います。

間違ってたらコメントなどで教えてください。

次回は aaguid からパスキープロバイダ(パスワードマネージャーとか)の名前を取得する方法あたりを、書けたら書きます。

ではまた。

Discussion