Back to 20 Concepts
cryptography-passwords • Expert
WebAuthn & FIDO2: Biometric Hardware Passkeys & Phishing Defense
WebAuthn replaces passwords with asymmetric public-key cryptography stored in device hardware Secure Enclaves (TouchID, FaceID, YubiKey). Login challenges are signed by device private keys bound strictly to origin domain names, making credential phishing mathematically impossible.
Intuitive Mental Model
The Domain-Locked Biometric Safe: TouchID signs a cryptographic challenge directly on your laptop TPM chip. Because the browser binds the signature strictly to "login.bank.com", a phishing clone at "login.fake-bank.com" cannot trick your device into signing.
Architecture Blueprint & CodeProduction Standard
// Browser WebAuthn API:
const credential = await navigator.credentials.create({
publicKey: {
challenge: serverChallengeUint8,
rp: { name: "Corp Portal", id: "corp.io" },
user: { id: userIdUint8, name: "alice@corp.io", displayName: "Alice" },
pubKeyCredParams: [{ alg: -7, type: "public-key" }], // ES256
authenticatorSelection: { userVerification: "required" }
}
});Key Architectural Takeaways
- •Zero Server-Side Passwords: The server stores only public keys; a database breach reveals zero credentials.
- •Phishing Resistance: Hardware binds cryptographic signatures strictly to the browser's actual TLS origin domain.
Common Architectural Pitfall
Failing to verify the clientDataJSON challenge and origin on the backend server during passkey registration/login.
Production Best Practice
Always parse and verify clientDataJSON on the backend before accepting WebAuthn credentials.