Implementing WebAuthn and Passkeys

In this lesson, you will learn how to transition from traditional secrets to passwordless authentication by integrating the WebAuthn API into your Node.js backend.

Moving Beyond Passwords

Password-based authentication relies on a "shared secret," which is a liability. WebAuthn shifts this paradigm to asymmetric cryptography. Instead of storing a password hash, your server stores a public key associated with a user. When the user logs in, their device (the "Authenticator") uses its corresponding private key to sign a challenge sent by your server, proving ownership without ever transmitting a password over the wire.

The WebAuthn Workflow

The process involves two primary phases: Registration (creating a credential) and Authentication (verifying it).

1. Registration

When a user decides to register a passkey, your Node.js server generates a challenge (a cryptographically secure random buffer) and sends it to the browser. The browser triggers the system's biometric or hardware prompt, and the hardware generates a new key pair, returning the public key and the credential ID to your server. You store these in your database linked to the user.

2. Authentication

When the user returns to log in, your server sends the stored challenge to the browser. The browser retrieves the private key associated with the credential ID and signs the challenge. Your server then uses the stored public key to verify that the signature is authentic.

// Conceptual verification on the Node.js backend
const verifyAuthentication = async (clientData, signature, publicKey) => {
  // Use a library like @simplewebauthn/server to verify
  // The signature must match the challenge sent earlier
  const verification = await verifyAssertion({
    response: clientData,
    expectedChallenge: storedChallenge,
    authenticator: { publicKey, counter },
  });
  
  return verification.verified;
};

Security Considerations

Because the private key never leaves the user’s device (often secured by a Trusted Execution Environment or hardware security chip), passkeys are inherently resistant to phishing, credential stuffing, and man-in-the-middle attacks. When implementing this, ensure your rpID (Relying Party ID) matches your domain exactly, as the browser enforces strict origin binding to prevent cross-site identity theft.

Key Takeaway: WebAuthn replaces shared secrets with public-key cryptography, allowing users to authenticate via hardware-backed signatures that eliminate the risks of password theft.