WebAuthn パスキーの自動入力を使用したフォームへのパスワードレス ログイン

WebAuthn の条件付き UI は、ブラウザのフォーム自動入力機能を活用して、従来のパスワードベースのフローでユーザーがパスキーでシームレスにログインできるようにします。

Chrome 108 では、自動入力候補など、パスキーがサポートされています。これにより、サイトはより安全な簡単なログイン エクスペリエンスを構築できます。

パスキーとは

パスキーは、ユーザー アカウントとウェブサイトまたはアプリに関連付けられたデジタル認証情報です。パスキーはパスワードよりも安全です。パスキーは、ユーザーが生体認証センサー(指紋や顔認識など)、PIN、パターンを使用してアプリやウェブサイトにログインできるため、パスワードを覚えたり管理したりする必要がなくなります。WebAuthn 認証情報であるため、次のセキュリティ機能が含まれています。

  • パスキーは公開鍵暗号を使用するため、サイトはパスワードやシークレットを保存する必要がありません。
  • パスキーは作成したウェブサイトまたはアプリでのみ使用できるため、ユーザーがフィッシングの被害に遭うことはありません。

ウェブサイトでは、ブラウザのモーダル UI を介して、デバイスやセキュリティ キー上で WebAuthn 認証情報を作成して使用できます。そのため、ウェブサイトはログインフローを再設計し、ユーザーが別のボタンを使用して WebAuthn フローを選択できるようにする必要がありました。パスキーで自動入力を有効にすることで、ウェブサイトはパスワード ユーザーとパスキー ユーザーの両方に同じエクスペリエンスを提供できるようになりました。

条件付き UI

モーダル UI をトリガーせずにウェブサイトが WebAuthn リクエストを実行できるようにすることを「条件付きメディエーション」といいます。この自動入力の統合は、「条件付き UI」と呼ばれることもあります。

条件付き UI でログインするユーザー

仕組み

ユーザーがユーザー名の入力フィールドをタップすると、自動入力候補のダイアログがポップアップし、保存されているパスキーとパスワードの自動入力候補が表示されます。ユーザーはアカウントを選択し、デバイスの画面ロックを使用してログインできます。これにより、ユーザーは何も変更していないかのように既存のパスワード フォームでウェブサイトにログインでき、しかもパスキーのセキュリティ上のメリットが増しています。

条件付き UI の使用方法

WebAuthn の条件付き UI を使用するには、パスワードなしでログインするためのパスキーを作成するフォームの自動入力でパスキーを使用してログインするをご覧ください。

写真提供: Scott GrahamUnsplash