[パスキーでログイン] ボタン
パスキーは、数回タップするだけでデバイスの画面ロックを解除することで、フォームを使用することなくログインできるようにします。パスキーにはユーザーのユーザー名と表示名が含まれているため、ブラウザまたはオペレーティング システムでは、アカウント選択ツールを表示してログインするアカウントを選択し、画面のロックを解除して確認できます。[パスキーでログイン] ボタンを配置すると、ウェブサイトやアプリはユーザーにフローの開始を促すことができます。
このユーザーキーは、パスキー ユーザーしかいないと判断される RP に推奨されます。RP にパスキーがないユーザーも、フォームを使用してユーザー名やパスワードなどの他の方法でログインできるようにする必要があります。そのような場合は、フォーム項目にパスキーの自動入力の候補を表示することをおすすめします。
フォーム項目にパスキーの自動入力候補を表示
パスキーベースの認証は、シンプルな「パスキーでログイン」ボタンを介して提供できます。ただし、パスワードを持つユーザーがいる場合、RP はそのユーザーに対してログイン フォームを提供する必要があります。両方のタイプのユーザーをサポートするには、ユーザー名とパスワードのフォームを代わりに使用します。これにより、ユーザーはパスワードとパスキーの自動入力候補(使用可能な場合)を確認できます。これにより、ユーザーがパスキーやパスワードを使用しているかどうかを覚えておく必要もなくなります。
この設定では、フォーム フィールドにカーソルを置くとすぐにアカウント セレクタが表示されます。アカウントを選択すると、アカウントがパスワードベースであれば、ユーザー名とパスワードのフィールドに自動入力されます。アカウントがパスキーベースの場合は、すぐにデバイスのロックを解除してログインを試みます。
このユーザー エクスペリエンスは、RP がパスワードベースの認証または多要素認証からパスキーを使用したパスワードレス認証に移行する場合に適しています。
以下のユーザー エクスペリエンスを構築する方法をご覧ください。
再認証
再認証は、ユーザーがすでにログインしているものの、セッションが期限切れになった場合や、機密性の高い操作(配送先住所の追加や購入など)を実行しようとしているために、追加の認証が必要な場合に行います。
パスワード ベースの認証では、ユーザーは再認証にパスワードの入力を求められますが、パスキーを使用すると、RP はデバイスのロックを解除して再認証を求めることができます。
このクイック認証により、同じユーザーがデバイスの前にいることを確認できるため、安全性が高まります。
以下のユーザー エクスペリエンスを構築する方法をご覧ください。
- 初めての WebAuthn アプリを作成する(Codelab)
スマートフォンでログインする
パスキーは、同じエコシステムを構成するデバイス間で同期されます。たとえば、ユーザーが Android でパスキーを作成した場合は、同じ Google アカウントにログインしている限り、すべての Android デバイスでパスキーを使用できます。ただし、iOS、macOS、Windows では、Chrome などの同じブラウザを使用している場合でも、同じパスキーを使用できません。
スマートフォンがノートパソコンの近くにあり、ログインを承認すると、ユーザーはスマートフォン上のパスキーを使用して QR コードをスキャンして他のデバイスにログインできます。これは、さまざまなオペレーティング システムとブラウザで機能します。
ユーザーが Android デバイスを持っていて、ウェブサイトで Chrome を介してパスキーを作成したとします。パスキーは Android デバイス間で保存、同期されますが、他のエコシステムでは同期されません。macOS 13 の Safari でユーザーが同じウェブサイトにログインしようとした場合、Mac に保存されているパスキーはありません。ユーザーは Android デバイスを使用してログインし、2 台目のデバイスからパスキーを使用するように選択できます。Safari に表示された QR コードを、Android スマートフォンでスキャンしてパスキーを選択し、画面ロックで確認します。1 回限りのパスキー署名が Mac の Safari に戻され、ウェブサイトでユーザーのログインに使用されます。2 つのデバイスが Bluetooth を使用して互いに近接しているかどうかを確認します。
このパスキー認証のクロスデバイス、オペレーティング間システム メカニズムは FIDO で標準化されており、他のブラウザとともに Chrome や Safari でも使用できます。このユーザー エクスペリエンスを有効にするために、追加の作業は必要ありません。この機能は、デベロッパーが「パスキーでログイン」ボタンを使用するか、前述のパスキー自動入力の方法に従うと自動的に有効になります。