Credential Management APIとは何ですか？

ブラウザのパスワードマネージャーと連携して、ログイン情報の保存・取得を行うAPI。ユーザーのログイン体験をスムーズにする。

Credential Management APIのポイントは？

navigator.credentials.get() でブラウザに保存された認証情報を取得する。navigator.credentials.store() で新しい認証情報を保存する。パスワード認証だけでなくパスキーやフェデレーション認証にも対応。自動ログインやワンタップログインを実装できる

【クレデンシャルマネジメントエーピーアイ】

💡 ブラウザが「前にログインしたよね？自動で入れとくね」と手助けしてくれるAPI

📌 このページのポイント

Credential Management APIによる認証情報管理

ひよこ

ブラウザの「パスワードを保存しますか？」ってあれと関係あるの？

ペンギン先生

まさにそれ！Credential Management APIを使うと、あの「パスワード保存」機能とWebサイトがもっと賢く連携できるんだ。保存されたパスワードを自動で取り出してログイン画面に入れたり、新しいパスワードを保存したりできるよ

ひよこ

普通のログインフォームと何が違うの？

ペンギン先生

普通のフォームだとブラウザが「たぶんこれがパスワード欄だろう」と推測するんだけど、このAPIを使えば「これがユーザー名でこれがパスワードです」と明確に伝えられるんだ。だからより正確にパスワードを保存・入力できるよ

ひよこ

パスワード以外にも使えるの？

ペンギン先生

FederatedCredentialでGoogleログインなどのソーシャルログイン情報も扱えるし、PublicKeyCredentialでパスキーにも対応しているよ。将来的にはパスワードなしのログインが主流になる流れだね

ひよこ

セキュリティ的に大丈夫なのかな？

ペンギン先生

HTTPS必須で、オリジン単位で厳密に管理されるから安全だよ。むしろユーザーが弱いパスワードを使い回すより、ブラウザのパスワードマネージャーと連携した方がずっとセキュアだね。サイト運営者もユーザーも両方にメリットがあるAPIだよ

まとめ：ざっくりこれだけ覚えればOK！

「Credential Management API」って出てきたら「ブラウザのパスワード管理と連携するAPI」と思えればだいたいOK！

📖 おまけ：英語の意味

「Credential Management API」＝資格情報管理API

💬 Credential（資格情報）を管理するAPIで、パスワードや認証情報をブラウザに安全に預ける仕組みだよ