CredentialsContainer: get() Methode
Baseline Widely available *
This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.
* Some parts of this feature may have varying levels of support.
Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.
Die get()
Methode des CredentialsContainer
Interfaces gibt ein Promise
zurück, das mit einem einzelnen Credential erfüllt wird, welches dann verwendet werden kann, um einen Benutzer auf einer Website zu authentifizieren.
Die Methode akzeptiert ein einzelnes optionales options
Argument, das Folgendes enthalten kann:
- Eine
mediation
Eigenschaft, die angibt, wie und ob der Benutzer gebeten werden sollte, an der Operation teilzunehmen. Dies steuert zum Beispiel, ob die Seite einen Benutzer stillschweigend mit einem gespeicherten Credential anmelden kann. - Eine
signal
Eigenschaft, die es ermöglicht, die Operation mit einemAbortController
abzubrechen. - Eine oder mehrere Eigenschaften —
password
,federated
,identity
,otp
,publicKey
— die die Arten von Credentials angeben, die angefordert werden. Wenn gesetzt, enthalten die Werte dieser Eigenschaften alle Parameter, die der Browser benötigt, um ein passendes Credential des angeforderten Typs zu finden.
Die API erfüllt immer mit einem einzigen Credential oder null
. Wenn mehrere Credentials verfügbar sind und Benutzermediation erlaubt ist, wird der Browser den Benutzer bitten, ein einzelnes Credential auszuwählen.
Syntax
get()
get(options)
Parameter
options
Optional-
Ein Objekt, das Optionen für die Anfrage enthält. Es kann die folgenden Eigenschaften enthalten:
mediation
Optional-
Ein String, der angibt, ob der Benutzer bei jedem Besuch einer Client-App zur Anmeldung aufgefordert wird. Der Wert kann einer der folgenden sein:
"conditional"
-
Entdeckte Credentials werden dem Benutzer in einem nicht-modalen Dialogfeld zusammen mit einem Hinweis auf den Ursprung präsentiert, der nach Credentials fragt. In der Praxis bedeutet dies, verfügbare Credentials automatisch auszufüllen; siehe Anmeldung mit einem Passkey durch Formular-Autofill für weitere Details zur Verwendung;
PublicKeyCredential.isConditionalMediationAvailable()
liefert ebenfalls einige nützliche Informationen. "optional"
-
Wenn Credentials für eine gegebene Operation ohne Benutzermediation übergeben werden können, werden sie es, was eine automatische Wiederanmeldung ohne Benutzermediation ermöglicht. Wenn Benutzermediation erforderlich ist, wird der Benutzeragent den Benutzer zur Authentifizierung auffordern. Dieser Wert ist für Situationen gedacht, in denen Sie hinreichendes Vertrauen haben, dass ein Benutzer nicht überrascht oder verwirrt über das Auftauchen eines Anmeldedialogs ist – zum Beispiel auf einer Website, die Benutzer nicht automatisch anmeldet, wenn ein Benutzer gerade einen "Login/Signup"-Button geklickt hat.
"required"
-
Der Benutzer wird immer zur Authentifizierung aufgefordert, selbst wenn das stille Zugreifen verhindern (siehe
CredentialsContainer.preventSilentAccess()
) auffalse
gesetzt ist. Dieser Wert ist für Situationen gedacht, in denen Sie die Benutzer-Authentifizierung erzwingen wollen – zum Beispiel, wenn Sie wollen, dass ein Benutzer bei einer sensiblen Operation (wie der Bestätigung einer Kreditkartenzahlung) erneut authentifiziert wird oder wenn Benutzer gewechselt werden. "silent"
-
Der Benutzer wird nicht zur Authentifizierung aufgefordert. Der Benutzeragent wird den Benutzer automatisch wieder authentifizieren und anmelden, wenn möglich. Wenn eine Zustimmung erforderlich ist, wird das Promise mit
null
erfüllt. Dieser Wert ist für Situationen gedacht, in denen Sie wollen, dass ein Benutzer beim Besuch einer Web-App automatisch angemeldet wird, wenn möglich, aber wenn nicht, wollen Sie ihm keinen verwirrenden Anmeldedialog anzeigen. Stattdessen wollen Sie darauf warten, dass er explizit auf einen "Login/Signup"-Button klickt.
Der Standardwert ist
"optional"
.Hinweis: Im Falle einer federated authentication (FedCM API) Anfrage kann ein
mediation
-Wert vonoptional
odersilent
zu einem Versuch der automatischen Wiederanmeldung führen. Ob dies erfolgt ist, wird dem Identitätsanbieter (IdP) über denis_auto_selected
Parameter mitgeteilt, der während der Validierung an denid_assertion_endpoint
des IdP gesendet wird, sowie der verlassenden Partei (RP) über dieIdentityCredential.isAutoSelected
Eigenschaft. Dies ist nützlich für Leistungsevaluierungen, Sicherheitsanforderungen (der IdP könnte wünschen, automatische Wiederanfragen abzulehnen und immer Benutzermediation zu verlangen) sowie für die allgemeine Benutzererfahrung (ein IdP oder RP könnte wünschen, unterschiedliche UX für Auto- und Nicht-Auto-Login-Erfahrungen zu zeigen). signal
Optional-
Ein
AbortSignal
Objektinstanz, die es erlaubt, eine laufendeget()
Operation abzubrechen. Eine abgebrochene Operation kann normal abgeschlossen werden (normalerweise, wenn der Abbruch nach Abschluss der Operation empfangen wurde) oder mit einemAbortError
DOMException
abgewiesen werden. password
Optional-
Diese Option fordert den Browser auf, ein gespeichertes Passwort als ein
PasswordCredential
Objekt abzurufen. Es ist ein boolescher Wert. identity
Optional-
Diese Option fordert den Browser auf, ein federated identity credential als ein
IdentityCredential
Objekt unter Verwendung der Federated Credential Management API abzurufen.Der Wert dieser Option ist ein
IdentityCredentialRequestOptions
Objekt, das Details der spezifischen Identitätsanbieter enthält, die die Website verwenden möchte. federated
Optional-
Diese Option fordert den Browser auf, ein federated identity credential als ein
FederatedCredential
Objekt abzurufen. Dieses Interface ist jetzt veraltet, und Entwickler sollten bevorzugt dieidentity
Option verwenden, wenn sie verfügbar ist.Der Wert dieser Option ist ein Objekt mit den folgenden Eigenschaften:
protocols
-
Ein Array von Strings, die die Protokolle der angeforderten Credentials der föderierten Identitätsanbieter repräsentieren (zum Beispiel
"openidconnect"
). providers
-
Ein Array von Strings, die die Anbieter der föderierten Identitäts-Credentials repräsentieren (zum Beispiel
"https://www.facebook.com"
oder"https://accounts.google.com"
).
otp
Optional-
Diese Option fordert den Browser auf, ein Einmal-Passwort (OTP) als ein
OTPCredential
Objekt abzurufen.Der Wert dieser Option ist ein Array von Strings, das nur den Stringwert
"sms"
enthalten kann. publicKey
Optional-
Diese Option fordert den Browser auf, eine Behauptung, die mit der Web Authentication API signiert wurde als ein
PublicKeyCredential
abzurufen.Der Wert dieser Option ist ein
PublicKeyCredentialRequestOptions
Objekt.
Rückgabewert
Ein Promise
, das mit einer der folgenden Unterklassen von Credential
aufgelöst wird:
Wenn konditionale Mediation in dem get()
Aufruf spezifiziert war, wird das Browser-UI-Dialog angezeigt und das Promise bleibt schwebend, bis der Benutzer ein Konto auswählt, mit dem er sich anmelden möchte, aus den verfügbaren Auto-Fill-Vorschlägen:
- Wenn der Benutzer dann eine Geste außerhalb des Browser-UI-Dialogs macht, schließt es sich, ohne das Promise aufzulösen oder abzulehnen und ohne eine Benutzersichtbare Fehlermeldung zu verursachen.
- Wenn der Benutzer ein Credential auswählt, wird das relevante
PublicKeyCredential
dem Anrufer zurückgegeben.
Wenn ein einzelnes Credential nicht eindeutig ermittelt werden kann, wird das Promise mit null
aufgelöst.
Ausnahmen
AbortError
DOMException
-
Die Anfrage wurde durch einen Aufruf der
abort()
Methode desAbortController
, der mit dersignal
Option dieser Methode verbunden ist, abgebrochen. IdentityCredentialError
DOMException
-
Beim Anfordern eines
IdentityCredential
ist die Anfrage an den ID Assertion Endpoint nicht fähig, die Authentifizierung zu validieren, und lehnt mit einer Fehlermeldung ab, die Informationen über den Grund enthält. NetworkError
DOMException
-
Beim Anfordern eines
IdentityCredential
hat der Identitätsanbieter (IdP) nicht innerhalb von 60 Sekunden geantwortet, die bereitgestellten Credentials waren nicht gültig/gefunden, oder der Anmeldestatus des Browsers für den IdP ist auf "abgemeldet" gesetzt (siehe Loginstatus mit der Login Status API aktualisieren für weitere Informationen zum FedCM-Anmeldestatus). Im letzteren Fall kann es eine gewisse Verzögerung bei der Ablehnung geben, um den IdP-Anmeldestatus nicht an die RP weiterzugeben. NotAllowedError
DOMException
-
In einer der folgenden Situationen ausgelöst:
-
Die Verwendung dieser API wurde durch eine der folgenden Permissions Policies blockiert:
-
Der aufrufende Ursprung ist ein opaker Ursprung.
-
SecurityError
DOMException
-
Die aufrufende Domain ist keine gültige Domain.
Beispiele
Abrufen eines federierten Identitätscredentials
Vertrauenswürdige Parteien können get()
mit der identity
Option aufrufen, um eine Anfrage zur Anmeldung der Benutzer bei der vertrauenswürdigen Partei über einen Identitätsanbieter (IdP) mittels Identitätsföderation zu stellen. Eine typische Anfrage sieht so aus:
async function signIn() {
const identityCredential = await navigator.credentials.get({
identity: {
providers: [
{
configURL: "https://accounts.idp.example/config.json",
clientId: "********",
nonce: "******",
},
],
},
});
}
Sehen Sie sich Federated Credential Management (FedCM) API für weitere Details darüber an, wie dies funktioniert. Dieser Aufruf beginnt den Anmeldeablauf, der in FedCM-Anmeldeablauf beschrieben ist.
Ein ähnlicher Aufruf, der die context
und loginHint
Erweiterungen beinhaltet, würde so aussehen:
async function signIn() {
const identityCredential = await navigator.credentials.get({
identity: {
context: "signup",
providers: [
{
configURL: "https://accounts.idp.example/config.json",
clientId: "********",
nonce: "******",
loginHint: "user1@example.com",
},
],
},
});
}
Wenn der IdP nicht in der Lage ist, eine Anfrage an den ID Assertion Endpoint zu validieren, wird er das Promise, das aus CredentialsContainer.get()
zurückgegeben wird, ablehnen:
async function signIn() {
try {
const identityCredential = await navigator.credentials.get({
identity: {
providers: [
{
configURL: "https://accounts.idp.example/config.json",
clientId: "********",
nonce: "******",
},
],
},
});
} catch (e) {
// Handle the error in some way, for example provide information
// to help the user succeed in a future sign-in attempt
console.error(e);
}
}
Abrufen eines öffentlichen Schlüsselcredentials
Der folgende Ausschnitt zeigt einen typischen get()
Aufruf mit der WebAuthn publicKey
Option:
const publicKey = {
challenge: new Uint8Array([139, 66, 181, 87, 7, 203, ...]),
rpId: "acme.com",
allowCredentials: [{
type: "public-key",
id: new Uint8Array([64, 66, 25, 78, 168, 226, 174, ...])
}],
userVerification: "required",
}
navigator.credentials.get({ publicKey })
Ein erfolgreicher get()
Aufruf gibt ein Promise zurück, das mit einem PublicKeyCredential
Objektinstanz aufgelöst wird, das ein über WebAuthn create()
zuvor erstelltes öffentliches Schlüsselcredential darstellt, das nun verwendet wurde, um einen Benutzer zu authentifizieren. Seine PublicKeyCredential.response
Eigenschaft enthält ein AuthenticatorAssertionResponse
Objekt, das Zugriff auf mehrere nützliche Informationsstücke bietet, darunter die Authenticator-Daten, Unterschrift und Benutzerkennung.
navigator.credentials.get({ publicKey }).then((publicKeyCredential) => {
const response = publicKeyCredential.response;
// Access authenticator data ArrayBuffer
const authenticatorData = response.authenticatorData;
// Access client JSON
const clientJSON = response.clientDataJSON;
// Access signature ArrayBuffer
const signature = response.signature;
// Access userHandle ArrayBuffer
const userHandle = response.userHandle;
});
Einige dieser Daten müssen auf dem Server gespeichert werden — zum Beispiel die signature
, um den Nachweis zu erbringen, dass der Authenticator den echten privaten Schlüssel besitzt, der zur Erstellung des Credentials verwendet wurde, und die userHandle
, um den Benutzer mit dem Credential, dem Anmeldeversuch und anderen Daten zu verknüpfen.
Siehe Authentifizieren eines Benutzers für mehr Informationen darüber, wie der gesamte Ablauf funktioniert.
Abrufen eines Einmal-Passworts
Der folgende Code löst den Berechtigungsfluss des Browsers aus, wenn eine SMS-Nachricht eintrifft. Wird die Berechtigung erteilt, wird das Promise mit einem OTPCredential
Objekt aufgelöst. Der darin enthaltene code
Wert wird dann als Wert eines <input>
Formularelements gesetzt, das anschließend übermittelt wird.
navigator.credentials
.get({
otp: { transport: ["sms"] },
signal: ac.signal,
})
.then((otp) => {
input.value = otp.code;
if (form) form.submit();
})
.catch((err) => {
console.error(err);
});
Spezifikationen
Specification |
---|
Credential Management Level 1 # dom-credentialscontainer-get |
Browser-Kompatibilität
Report problems with this compatibility data on GitHubdesktop | mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
get | ||||||||||||
identity option | ||||||||||||
identity.context | ||||||||||||
Error API | ||||||||||||
identity.providers.loginHint | ||||||||||||
otp option | ||||||||||||
publicKey option | ||||||||||||
get() extensions | ||||||||||||
appid extension | ||||||||||||
largeBlob extension |
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support
- No support
- No support
- Experimental. Expect behavior to change in the future.
- Non-standard. Check cross-browser support before using.