CredentialsContainer: create() メソッド
Baseline
広く利用可能
*
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2019年9月以降、すべてのブラウザーで利用可能です。
* この機能の一部は、対応レベルが異なる場合があります。
安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。
create() は CredentialsContainer インターフェイスのメソッドで、新しい資格情報を作成します。この資格情報は保存され、後で navigator.credentials.get() メソッドを使用して取得できます。取得した認証情報は、ウェブサイトがユーザーを認証するために使用できます。
このメソッドは、3 種類の異なる資格情報に対応しています。
- パスワード資格情報: ユーザーがパスワードを使用してログインできるようにしま。
- 連合資格情報: ユーザーが連合 ID プロバイダーを使用してログインできるようにします。
- 公開鍵資格情報: ユーザーがプラットフォームに組み込まれた生体認証リーダーや取り外し可能なハードウェアトークンなどの認証装置を使用してログインできるようにします。
連合資格情報管理 API (FedCM) が、連合資格情報型を置き換えていることに注意してください。
構文
create()
create(options)
引数
options省略可-
リクエストされた新しい
Credentialsオブジェクトのオプションを格納するオブジェクト。以下のプロパティを格納することができます。signal省略可-
進行中の
create()処理を中止させるためのAbortSignalオブジェクトのインスタンスです。中止された操作は、（完全に処理が終了した後に中止を受け取った場合は）正常に完了することもあれば、AbortErrorのDOMExceptionで拒否されることもあります。
以下のプロパティはそれぞれ、作成する「資格情報の種類」を表します。1 つだけを指定する必要があります。
federated省略可-
連合 ID プロバイダーの資格情報を作成するための要件を格納した
FederatedCredentialInitオブジェクトです。 password省略可-
パスワード資格情報を作成するための要件を格納した
PasswordCredentialInitオブジェクトです。 publicKey省略可-
公開鍵資格情報を作成するための要件を格納した
PublicKeyCredentialCreationOptionsオブジェクトです。create()呼び出しにより、ユーザーエージェントが認証器を介して新しい資格情報を生成するようリクエストします。これは、新規アカウントの登録、または既存アカウントへの新しい非対称鍵ペアの関連付けのいずれかの目的で行われます。メモ:
create()をpublicKey引数付きで使用すると、publickey-credentials-create権限ポリシーがサーバーに設定されている場合にブロックされることがあります。
返値
以下のいずれかに解決する Promise です。
FederatedCredential: 資格情報の種類がfederatedであった場合。PasswordCredential: 資格情報の種類がpasswordであった場合。PublicKeyCredential: 資格情報の種類がpublicKeyであった場合。
資格情報オブジェクトを作成できない場合、このプロミスは null で解決されます。
例外
TypeError-
PasswordCredential作成リクエストで、id、origin、passwordが指定されなかった（空だった）場合。 NotAllowedErrorDOMException-
以下のような原因で発生します。
publickey-credentials-create権限ポリシーにより、使用がブロックされた。- この関数がオリジンをまたいで呼び出されたが、iframe の
allow属性に適切なpublickey-credentials-createポリシーが設定されていない。 - この関数がオリジン間で呼び出されたが、
<iframe>で一時的な有効化が行われていない。 - 検出可能な資格情報の作成を試みているが（
create()呼び出しのPublicKeyCredentialCreationOptionsオプションでresidentKeyをrequiredに設定して）、ユーザーが検出可能な資格情報に対応するセキュリティキーを所持しておらず、操作をキャンセルする。
AbortErrorDOMException-
操作が中止された。
例
パスワード資格情報の作成
この例では、パスワード資格情報を PasswordCredentialInit から作成します。
const credInit = {
id: "1234",
name: "Serpentina",
origin: "https://example.org",
password: "the last visible dog",
};
const makeCredential = document.querySelector("#make-credential");
makeCredential.addEventListener("click", async () => {
const cred = await navigator.credentials.create({
password: credInit,
});
console.log(cred.name);
// Serpentina
console.log(cred.password);
// the last visible dog
});
連合資格情報の作成
この例では、連合資格情報を FederatedCredentialInit オブジェクトから作成します。
const credInit = {
id: "1234",
name: "Serpentina",
origin: "https://example.org",
protocol: "openidconnect",
provider: "https://provider.example.org",
};
const makeCredential = document.querySelector("#make-credential");
makeCredential.addEventListener("click", async () => {
const cred = await navigator.credentials.create({
federated: credInit,
});
console.log(cred.name);
console.log(cred.provider);
});
公開鍵資格情報の作成
この例では、公開鍵資格情報を PublicKeyCredentialCreationOptions オブジェクトから作成します。
const publicKey = {
challenge: challengeFromServer,
rp: { id: "acme.com", name: "ACME Corporation" },
user: {
id: new Uint8Array([79, 252, 83, 72, 214, 7, 89, 26]),
name: "jamiedoe",
displayName: "Jamie Doe",
},
pubKeyCredParams: [{ type: "public-key", alg: -7 }],
};
const publicKeyCredential = await navigator.credentials.create({ publicKey });
create() の呼び出しに成功すると、 PublicKeyCredential オブジェクトインスタンスに解決するプロミスを返します。これは、後に WebAuthn get() 呼び出しでユーザーを認証するために使用できる公開鍵資格情報を表しています。その PublicKeyCredential.response プロパティには AuthenticatorAttestationResponse オブジェクトが格納され、認証データ、公開鍵、転送メカニズムなど、いくつかの有益な情報にアクセスすることができます。
navigator.credentials.create({ publicKey }).then((publicKeyCredential) => {
const response = publicKeyCredential.response;
// attestationObject ArrayBuffer にアクセス
const attestationObj = response.attestationObject;
// client JSON にアクセス
const clientJSON = response.clientDataJSON;
// 認証器データの ArrayBuffer を返す
const authenticatorData = response.getAuthenticatorData();
// 公開鍵の ArrayBuffer を返す
const pk = response.getPublicKey();
// 公開鍵アルゴリズム識別子を返す
const pkAlgo = response.getPublicKeyAlgorithm();
// 許可されたトランスポートの配列を返す
const transports = response.getTransports();
});
このデータの一部は、この資格情報に対する将来の認証処理のためにサーバーに格納する必要があります。例えば、公開鍵、使用するアルゴリズム、許可されるトランスポートなどです。
メモ: 全体的にどのように作業が流れるかについての詳しい情報は、キーペアを生成してユーザーを登録を参照してください。
仕様書
| 仕様書 |
|---|
| Credential Management Level 1 # dom-credentialscontainer-create |