PublicKeyCredential.rawId — Eigenschaft · JavaScript-Referenz

Signatur

PublicKeyCredential.rawId

Beschreibung

Die Eigenschaft rawId eines PublicKeyCredential-Objekts liefert die Credential-ID als ArrayBuffer. Den Wert erzeugt der Authenticator (z. B. ein Sicherheitsschlüssel, Touch ID oder Windows Hello), wenn er mit navigator.credentials.create() ein Schlüsselpaar anlegt. Anhand dieser ID findet der Server den zugehörigen öffentlichen Schlüssel wieder.

Inhaltlich entspricht rawId der geerbten Eigenschaft id. Der Unterschied: id ist ein base64url-codierter String, rawId enthält die unveränderten Bytes. Für die Übertragung als JSON ist id oft bequemer. Wo eine binäre ID erwartet wird, etwa in allowCredentials oder excludeCredentials bei späteren Aufrufen, brauchen Sie die Rohdaten.

Typische Einsätze:

Nach der Registrierung die ID an den Server senden und dort zusammen mit dem öffentlichen Schlüssel speichern.
Bei der Anmeldung prüfen, welcher gespeicherte Schlüssel verwendet wurde.
Die ID in allowCredentials an navigator.credentials.get() übergeben, damit nur ein bestimmter Schlüssel angefragt wird.

Rückgabewert

Typ

ArrayBuffer

Beschreibung

Die binäre Credential-ID, die der Authenticator erzeugt hat. Die Länge hängt vom Authenticator ab und liegt typischerweise zwischen 16 und 1023 Bytes.

Beispiele

rawId nach der Registrierung an den Server senden

// ArrayBuffer -> base64url
const toBase64Url = (buffer) => {
  const bytes = new Uint8Array(buffer);
  let binary = '';
  for (const b of bytes) binary += String.fromCharCode(b);
  return btoa(binary).replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
};

const register = async (options) => {
  // options: vom Server geliefert (challenge, rp, user, pubKeyCredParams ...)
  const credential = await navigator.credentials.create({ publicKey: options });

  await fetch('/webauthn/register', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      id: credential.id,
      rawId: toBase64Url(credential.rawId),
      type: credential.type,
      attestationObject: toBase64Url(credential.response.attestationObject),
      clientDataJSON: toBase64Url(credential.response.clientDataJSON)
    })
  });

  console.log('Länge der Credential-ID:', credential.rawId.byteLength);
};

Länge der Credential-ID: 32

Gespeicherte ID für allowCredentials bei der Anmeldung verwenden

// base64url -> ArrayBuffer
const fromBase64Url = (str) => {
  const base64 = str.replace(/-/g, '+').replace(/_/g, '/');
  const padded = base64 + '='.repeat((4 - (base64.length % 4)) % 4);
  return Uint8Array.from(atob(padded), (c) => c.charCodeAt(0)).buffer;
};

const login = async (storedIds, challenge) => {
  const assertion = await navigator.credentials.get({
    publicKey: {
      challenge,
      allowCredentials: storedIds.map((id) => ({
        type: 'public-key',
        id: fromBase64Url(id)
      })),
      userVerification: 'preferred'
    }
  });
  return assertion.rawId;
};

rawId mit id vergleichen

const checkIds = (credential) => {
  const bytes = new Uint8Array(credential.rawId);
  const encoded = btoa(String.fromCharCode(...bytes))
    .replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
  console.log(encoded === credential.id);
};

true

// Wichtig · Fallstricke

Binärdaten: Ein ArrayBuffer wird von JSON.stringify() zu {} umgewandelt. Codieren Sie die Daten deshalb vor dem Senden selbst (base64url) oder verwenden Sie credential.toJSON(). toJSON() ist in neueren Browsern verfügbar, aber noch nicht überall.
base64url statt base64: Die Eigenschaft id verwendet base64url ohne Padding (- und _ statt + und /). Werden die beiden Formate verwechselt, schlagen Vergleiche auf dem Server fehl.
Nur lesbar: Zuweisungen an rawId werden ignoriert, im Strict Mode lösen sie einen TypeError aus.
Keine Authentifizierung: Die ID ist kein Geheimnis und beweist allein nichts. Maßgeblich ist, dass der Server die Signatur in response gegen den gespeicherten öffentlichen Schlüssel und die Challenge prüft.
Datenschutz: Die Credential-ID ist dauerhaft und kann einen Nutzer eindeutig identifizieren. Geben Sie sie nicht an Dritte weiter.
Kompatibilität: WebAuthn läuft nur in einem sicheren Kontext (HTTPS oder localhost). Alle aktuellen Browser unterstützen die API.

Siehe auch

Credential.id PasswordCredential.name PublicKeyCredential.id PublicKeyCredential.response PublicKeyCredential.authenticatorAttachment