Fix WebAuthn CSRF; clarify security key UI

- Fix webauthn.js CSRF token: read HMAC header value from
  body hx-headers attribute instead of cookie nonce
- Update profile labels to mention security keys/FIDO2
  alongside passkeys

Security: CSRF double-submit was broken for fetch()-based
WebAuthn requests — JS was sending the cookie nonce as the
header value instead of the HMAC. Fixed by reading the
server-rendered header token from the DOM.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-16 19:27:44 -07:00
parent 0b37fde155
commit 446b3df52d
3 changed files with 14 additions and 7 deletions

View File

@@ -10,12 +10,12 @@
</div>
{{if .WebAuthnEnabled}}
<div class="card">
<h2 style="font-size:1rem;font-weight:600;margin-bottom:1rem">Passkeys</h2>
<h2 style="font-size:1rem;font-weight:600;margin-bottom:1rem">Passkeys &amp; Security Keys</h2>
<p class="text-muted text-small" style="margin-bottom:.75rem">
Passkeys let you sign in without a password using your device's biometrics or a security key.
Register a passkey (Touch ID, Windows Hello) or a hardware security key (YubiKey, FIDO2) for passwordless sign-in or two-factor authentication.
</p>
{{template "webauthn_credentials" .}}
<h3 style="font-size:.9rem;font-weight:600;margin:1rem 0 .5rem">Add a Passkey</h3>
<h3 style="font-size:.9rem;font-weight:600;margin:1rem 0 .5rem">Add a Passkey or Security Key</h3>
{{template "webauthn_enroll" .}}
</div>
<script src="/static/webauthn.js"></script>