WebAuthn Client

Client-Library für Passkey-Registrierung und -Authentifizierung.

Installation

import { WebAuthnClient } from 'https://auth.deine-domain.de/client/webauthn-client.js';

Initialisierung

const webauthn = new WebAuthnClient({
  authServerUrl: 'https://auth.deine-domain.de'
});

API Methoden

addPasskey()

Registriert einen neuen Passkey für den aktuell angemeldeten Benutzer.

const result = await webauthn.addPasskey();

if (result.success) {
  console.log('Passkey registriert!');
}

authenticate()

Meldet den Benutzer mit einem Passkey an.

const result = await webauthn.authenticate();

if (result.success) {
  console.log('Angemeldet als:', result.user.name);
  console.log('Token:', result.token);
}

listPasskeys()

Listet alle Passkeys des aktuellen Benutzers.

const passkeys = await webauthn.listPasskeys();

passkeys.forEach(key => {
  console.log(key.deviceName);
  console.log(key.createdAt);
});

removePasskey()

Entfernt einen Passkey.

await webauthn.removePasskey(credentialId);

Vollständiges Beispiel

<!DOCTYPE html>
<html>
<head>
  <title>WebAuthn Demo</title>
</head>
<body>
  <button id="add-passkey">Passkey hinzufügen</button>
  <button id="login-passkey">Mit Passkey anmelden</button>

  <script type="module">
    import { WebAuthnClient } from 'https://auth.deine-domain.de/client/webauthn-client.js';

    const webauthn = new WebAuthnClient({
      authServerUrl: 'https://auth.deine-domain.de'
    });

    document.getElementById('add-passkey').addEventListener('click', async () => {
      const result = await webauthn.addPasskey();
      if (result.success) {
        alert('Passkey registriert!');
      }
    });

    document.getElementById('login-passkey').addEventListener('click', async () => {
      const result = await webauthn.authenticate();
      if (result.success) {
        alert(`Angemeldet als ${result.user.name}!`);
      }
    });
  </script>
</body>
</html>

Nächste Schritte

WebAuthn Übersicht - Mehr über WebAuthn
Registrierung - Passkey-Registrierung
Authentifizierung - Passkey-Login