Diese Seite wurde von der Cloud Translation API übersetzt.

Ursprungstest: Sofortige WebAuthn-Vermittlung für reibungslose Anmeldung

José Luis Zapata

Veröffentlicht am 19. August 2025

Die sofortige WebAuthn-Vermittlung ist eine neue Webfunktion, die Anmeldevorgänge für Nutzer vereinfachen soll. In diesem Ursprungstest werden die Funktion, ihre Vorteile und Implementierungsdetails vorgestellt. Wir laden Sie ein, teilzunehmen und die Zukunft der Webauthentifizierung mitzugestalten.

Hintergrund

Die Authentifizierung im Web ist oft umständlich und erschwert die Nutzeranmeldung. Vorhandene WebAuthn-Abläufe sind zwar leistungsstark, haben aber Probleme mit „Anmelden“-Schaltflächen, insbesondere wenn Anmeldedaten nicht sofort verfügbar sind. Dies führt zu Standardformular-Fallbacks.

Beispiel für den sofortigen Vermittlungsablauf

Mit dieser neuen Funktion wird ein Anmeldevorgang mit geringem Aufwand eingeführt, ähnlich wie bei preferImmediatelyAvailableCredentials-APIs auf Mobilgeräten. Die Anmeldung wird vereinfacht, oft noch vor den Standardanmeldeformularen. So wird die Nutzerfreundlichkeit verbessert.

Funktionsweise

WebAuthn-Immediate-Mediation ermöglicht eine direktere und effizientere Anmeldung. So kann der Browser sofort verfügbare Anmeldedaten anbieten oder sofort signalisieren, dass keine vorhanden sind, ohne dass eine geräteübergreifende Authentifizierung oder eine Authentifizierung mit Sicherheitsschlüssel erforderlich ist. Das vereinfacht die Implementierung für Entwickler.

Der Vermittlungstyp `immediate`

Wir führen den Vermittlungstyp immediate für navigator.credentials.get()-Anfragen ein. Wenn diese Option festgelegt ist, wird das Promise mit NotAllowedError abgelehnt, wenn keine lokal verfügbaren Anmeldedaten gefunden werden. Wenn Anmeldedaten vorhanden sind, führt der Browser den Authentifizierungsprozess wie gewohnt aus.

Diese Flexibilität ermöglicht es Websites, ihren Anmeldevorgang anzupassen und alternative Methoden anzubieten, wenn keine sofortigen Anmeldedaten verfügbar sind.

Browser können jedoch weiterhin NotAllowedError zurückgeben, um den Datenschutz und die Sicherheit der Nutzer zu gewährleisten und Probleme wie Fingerprinting oder Tracking zu verhindern.

Funktionserkennung

Mit PublicKeyCredential.getClientCapabilities() können Sie erkennen, ob die sofortige Vermittlung verfügbar ist. Entwickler können im zurückgegebenen capabilities-Objekt nach der Funktion immediateGet suchen.

async function checkImmediateMediationAvailability() {
  try {
    const capabilities = await PublicKeyCredential.getClientCapabilities();
    if (capabilities.immediateGet && window.PasswordCredential) {
      console.log("Immediate Mediation with passwords supported.");
    } else if (capabilities.immediateGet) {
      console.log("Immediate Mediation without passwords supported.");
    } else { console.log("Immediate Mediation unsupported."); }
  } catch (error) {
    console.error("Error getting client capabilities:", error);
  }
}

Hinweis:Um die Browserunterstützung zu verbessern, ist ein Polyfill für getClientCapabilities() im GitHub-Repository „WebAuthn Polyfills“ verfügbar.

Beispielimplementierung

Rufen Sie navigator.credentials.get() mit mediation: 'immediate' auf, um die API zu verwenden. Wir empfehlen, password: true in die Anfrage aufzunehmen, da die meisten Nutzer wahrscheinlich ein gespeichertes Passwort haben und sofort von dieser Funktion profitieren können.

button.addEventListener('click', async (event) => {
  event.preventDefault();
  event.stopPropagation();
  const cred = await navigator.credentials.get({
    password: true,
    publicKey: {
      challenge, // Your server-generated challenge
      rpId: 'example.com' // Your Relying Party ID
    },
    mediation: 'immediate',
  });
});

Entwickler sollten die NotAllowedError in einem catch-Block verarbeiten, um eine reibungslose Fallback-Anmeldung zu ermöglichen.

Schritt-für-Schritt-Anleitung für die sofortige Vermittlung

Die sofortige Vermittlung von WebAuthn unterstützt zwei primäre Anwendungsfälle, um die Nutzeranmeldung zu optimieren: Sie ermöglicht eine spezielle Schaltfläche „Mit Passkey anmelden“, mit der unerwünschte Fallback-Optionen unterdrückt werden, und einen dynamischen Anmeldevorgang, bei dem Anmeldedaten proaktiv vor einer nutzerkritischen Aktion angeboten werden.

Anwendungsfall 1: Explizite Anmeldung über die Anmeldeschaltfläche

In diesem Szenario wird eine spezielle Anmeldeschaltfläche bereitgestellt, um eine übersichtliche Nutzererfahrung ohne unerwartete Aufforderungen oder die Notwendigkeit, eine Anmeldeseite aufzurufen, zu gewährleisten.

Ablauf, bei dem Chrome bereits gespeicherte Anmeldedaten anbietet, wenn der Nutzer auf die Schaltfläche „Anmelden“ klickt.

Nutzer initiiert Anmeldung:Der Nutzer klickt auf eine Schaltfläche „Anmelden“. Die vertrauende Partei ruft dann navigator.credentials.get() mit mediation: "immediate" auf.
Browser fordert zur Auswahl von Anmeldedaten auf (falls verfügbar): Der Browser sucht nach lokal verfügbaren Passkeys oder angeforderten Passwörtern. Wenn Konten gefunden werden, wird dem Nutzer sofort eine modale Benutzeroberfläche angezeigt, in der er ein Konto auswählen kann. Konten werden nach dem Zeitstempel der letzten Verwendung und dann alphabetisch sortiert. Hinweis: Wenn sowohl Passwörter als auch Passkeys aus mehreren Passwortmanagern für dasselbe Konto gefunden werden, priorisiert der Browser Passkeys. Wenn für dasselbe Konto mehrere Passkeys von verschiedenen Anbietern vorhanden sind, wird der zuletzt verwendete Passkey priorisiert.
Erfolgreiche Anmeldung:Der Nutzer wählt den Passkey über die Browser-Benutzeroberfläche aus. Wenn der Browser eine Bestätigung erfordert, wird der Nutzer aufgefordert, seine Identität mit der zuvor eingerichteten Methode zu bestätigen, z. B. mit einer PIN, biometrischen Daten oder einem Muster. Die Anmeldung wird erfolgreich abgeschlossen.
Fallback-Pfad: kein Passkey oder Nutzer lehnt ab:Wenn für die Website keine lokalen Passkeys oder angeforderten Passwörter verfügbar sind oder der Nutzer die Browser-Benutzeroberfläche schließt, löst der Browser eine NotAllowedError für die vertrauende Partei aus und zeigt keine Benutzeroberfläche für geräteübergreifende oder Sicherheitsschlüsseloptionen an. Die vertrauende Partei kann dann mit ihrer Standardanmeldeseite fortfahren oder alternative Authentifizierungsmechanismen anbieten.

Anwendungsfall 2: Impliziter Anmeldeablauf vor einer Nutzeraktion

In diesem Szenario wird eine proaktive Anmeldung ermöglicht, bei der Passkeys und Passwörter angeboten werden, bevor ein Nutzer eine Aktion ausführt, für die ein authentifizierter Status erforderlich ist, z. B. die Kaufabwicklung.

Ablauf, bei dem Chrome bereits gespeicherte Anmeldedaten anbietet, wenn der Nutzer eine Aktion ausführt, für die er angemeldet sein muss.

Nutzer initiiert Aktion, für die eine Anmeldung erforderlich ist:Der Nutzer klickt auf eine Schaltfläche für eine Aktion, für die eine Anmeldung erforderlich ist, z. B. auf die Schaltfläche „Zur Kasse“. Die vertrauende Partei ruft dann navigator.credentials.get() mit mediation: "immediate" auf.
Browser fordert zur Auswahl von Anmeldedaten auf (falls verfügbar): Der Browser sucht nach lokal verfügbaren Passkeys oder Passwörtern. Wenn sie gefunden werden, wird dem Nutzer sofort eine modale Benutzeroberfläche angezeigt, in der er ein Konto auswählen kann. Konten werden nach dem Zeitstempel der letzten Verwendung und dann alphabetisch sortiert. Doppelte Einträge werden entfernt, sodass für jedes Konto nur ein Eintrag angezeigt wird. Hinweis: Wenn sowohl Passwörter als auch Passkeys aus mehreren Passwortmanagern für dasselbe Konto gefunden werden, priorisiert der Browser Passkeys. Wenn für dasselbe Konto mehrere Passkeys von verschiedenen Anbietern vorhanden sind, wird der zuletzt verwendete Passkey priorisiert.
Erfolgreiche Anmeldung:Der Nutzer wählt Anmeldedaten über die Browser-UI aus. Wenn der Browser eine Bestätigung erfordert, wird der Nutzer aufgefordert, seine Identität mit der zuvor eingerichteten Methode zu bestätigen, z. B. mit einer PIN, biometrischen Daten oder einem Muster. Die Anmeldung wird erfolgreich abgeschlossen.
Fallback-Pfad: Keine Anmeldedaten oder Nutzer schließt die Browser-UI: Wenn keine lokalen Anmeldedaten für die Website verfügbar sind oder der Nutzer die Browser-UI schließt, löst der Browser eine NotAllowedError für die vertrauende Partei aus und zeigt keine UI an. Für die Nutzer ändert sich nichts an der Anmeldung. Die vertrauende Partei kann den Nutzer dann nach weiteren Details fragen (z. B. nach der E-Mail-Adresse) oder alternative Authentifizierungsmechanismen wie ein Passwortformular, die SMS-Bestätigung oder eine WebAuthn-Modalanfrage anzeigen, die geräteübergreifende Authentifikatoren unterstützt.

Vorteile

Die sofortige Vermittlung von WebAuthn bietet Entwicklern und Nutzern mehrere wichtige Vorteile:

Reibungslose Anmeldung:Nutzer, die sofort verfügbare Passkeys oder Passwörter in ihrem Browser oder Passwortmanager gespeichert haben, können sich einfacher und reibungsloser anmelden.
Intelligente Anmeldung:Die API ermöglicht einen Anmeldevorgang, wenn der Nutzer Aktivitäten ausführen möchte, für die eine Anmeldung erforderlich ist. Diese passen sich intelligent an den Anmeldedatenstatus des Nutzers an. Wenn möglich, wird die Authentifizierung sofort durchgeführt, um unnötige Weiterleitungen zu vermeiden und den Ablauf zu optimieren.
Verbesserte Verwaltung von Anmeldedaten: Wenn mehrere Passwortmanager Anmeldedaten für dasselbe Konto anbieten, wählt der Browser auf intelligente Weise die am besten geeignete Option aus. So wird die Verwaltung von Anmeldedaten für Nutzer vereinfacht.
Weniger Verwirrung bei Nutzern:Da bekannte Anmeldedaten direkt angezeigt werden, minimiert die Funktion die Verwirrung, die oft mit mehreren Anmeldeoptionen oder Standardformularen einhergeht.
Nahtloses Fallback:Nutzer ohne sofort verfügbare Anmeldedaten werden nahtlos zu den Standardanmeldeseiten weitergeleitet. Für sie ändert sich also nichts.

Datenschutz und Sicherheit

Durch die sofortige Vermittlung von WebAuthn können Websites das Vorhandensein von sofort verfügbaren Anmeldedaten erkennen, bevor ein Nutzer einen Anmeldeversuch explizit autorisiert. Um die Privatsphäre der Nutzer zu schützen und potenziellen Missbrauch zu verhindern, ergreifen wir mehrere wichtige Maßnahmen:

Anforderung an Nutzergeste:Für den API-Aufruf ist eine Nutzergeste (eine beliebige vorübergehende Nutzeraktivierung) erforderlich. Dadurch wird es für Websites schwieriger, im Hintergrund Informationen zu sammeln und Fingerprinting durchzuführen.
Inkognito- und private Sitzungen:In Inkognito- oder privaten Sitzungen wird bei jeder sofortigen Vermittlungsanfrage NotAllowedError ausgegeben.
Einschränkungen für allowCredentials-Listen:Anfragen mit allowCredentials-Listen lösen NotAllowedError aus. Dadurch wird verhindert, dass Websites den Verlauf der Nutzerinteraktionen ableiten oder Nutzer sitzungsübergreifend tracken.
Kündigung:Das Festlegen des Parameters signal für eine Anfrage mit sofortiger Vermittlung ist ungültig. Dadurch wird verhindert, dass Websites Browser-UIs programmatisch schließen.

Jetzt ausprobieren

Wir empfehlen Ihnen, die sofortige Vermittlung von WebAuthn auszuprobieren.

Status in Chrome

Diese Funktion durchläuft den Chromium-Entwicklungszyklus:

Desktop:Entwicklertest in Chrome 136, Ursprungstest von Chrome 139 bis 141.
Android:Das Dev Trial ist in Chrome 140 verfügbar.

Für lokales Testen

So testen Sie die sofortige Vermittlung von WebAuthn lokal:

Chrome 139 herunterladen:Laden Sie die aktuelle Version von Chrome auf Ihren Computer herunter und öffnen Sie sie.
Flag „Immediate Mediation“ aktivieren:Rufen Sie chrome://flags/#web-authentication-immediate-get in der Adressleiste auf und aktivieren Sie das Flag „Web Authentication Immediate Get“.
Anmeldedaten vorbereiten:Achten Sie darauf, dass Sie verwendbare Passkeys und Passwörter gespeichert haben:
- Im Google Passwortmanager gespeicherte Passwörter
- Passkeys, die im Google Passwortmanager gespeichert sind (erfordert die Anmeldung und Synchronisierung von Chrome mit einem Google-Konto), Windows Hello oder dem iCloud-Schlüsselbund.

Für öffentliche Tests (Ursprungstest)

So testen Sie die sofortige Vermittlung von WebAuthn mit dem Ursprungstest in einer öffentlichen Umgebung:

Registrieren:Rufen Sie die Seite „Chrome Origin Trials“ auf und registrieren Sie sich für den Test „WebAuthn immediate mediation“.
Token zu HTTP-Headern hinzufügen:Fügen Sie das bereitgestellte Origin Trial-Token in die HTTP-Header Ihrer Website ein: HTML Origin-Trial: [YOUR_TRIAL_TOKEN]

Hinweis:Sie können Ihre Tokens auch programmatisch mit JavaScript bereitstellen.

Testszenarien

Wir stellen eine Referenzimplementierung zur Verfügung und empfehlen Ihnen, ein eigenes Prototyp zu erstellen, um verschiedene Szenarien zu testen.

Referenzdemo:Sie können die Referenzimplementierung unter https://deephand.github.io/webauthn-immediate-demo/ ausprobieren.
- Prototyp implementieren:Wenn Sie einen Prototyp auf Ihrer Website implementieren, achten Sie darauf, dass der navigator.credentials.get()-Aufruf mit mediation: 'immediate' nach einem Nutzerklick erfolgt, z. B. auf eine Schaltfläche „Anmelden“ oder eine andere Interaktion, für die der Nutzer angemeldet sein muss.
Ablauf 1: Anmeldung ohne Passwort oder Passkey:Wenn Sie keine Passkeys oder Passwörter für die Website haben, werden Sie durch Klicken auf „Anmelden“ direkt zur Standardanmeldeseite weitergeleitet. Es wird keine Browser-Benutzeroberfläche angezeigt.
Ablauf 2: Anmeldung mit einem sofort verfügbaren lokalen Passkey:Wenn Sie einen Passkey für die Website gespeichert haben, sollte durch Klicken auf „Anmelden“ die Immediate Mediation-Benutzeroberfläche aufgerufen werden, in der der Passkey zur Auswahl angeboten wird.
Ablauf 3: Mit einem lokalen Passkey oder Passwort anmelden:Wenn Sie sowohl Passkeys als auch Passwörter gespeichert haben, aktivieren Sie die Option „Passwort anfordern“ (indem Sie password: true in Ihrem Code festlegen). Wenn Sie auf „Anmelden“ klicken, sollten in der Immediate Mediation-Benutzeroberfläche sowohl die Passkey- als auch die Passwortoptionen angezeigt werden.

Ursprungstest: Sofortige WebAuthn-Vermittlung für reibungslose Anmeldung Mit Sammlungen den Überblick behalten Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.