本文へ移動

§04-01Auth

Passkey / WebAuthn

生体認証などでパスワードなしにログインする。

パスワードの記憶や入力を不要にし、フィッシングにも強い。ログインの離脱を減らしたいサービスに向く。

実装のポイント

navigator.credentials.get に publicKey オプションを渡して認証する。入力欄に autocomplete=「username webauthn」を付けると自動入力の候補にパスキーが出る。

特徴
  • ブラウザ API
デモで使っているもの
  • shadcn/ui
  • lucide-react

このパターンが効く目的