Sign-up with passkeys
In this page, you can experience and learn sign-up flow using passkeys. Ideally,
sign-up with a passkey should involve identity verification process such as
email address verification, but in this demo, we skip that and directly create a
passkey.
## How to use
Enter a username you'd like to use for the new account in the username field and
press enter. If passkey is usable, the browser will prompt you to create a new
passkey, otherwise proceed to the next page to enter a new password.
## How to develop
Use [WebAuthn](https://www.w3.org/TR/webauthn/) to build a passkey experience.
You can create a passkey by invoking `navigator.credentials.create()` call. Make
sure that the new passkey is associated with the new username the user has just
entered.
There are a lot of tricks you can perform to make the future passkey experience
better. Here's a checklist:
* Specify `"platform"` as the authenticator attachment value to pass to
`navigator.credentials.create()` for a promoted passkey creation.
* Verify the user with the strongest authentication method available for the
user before allowing them to create a passkey.
* Prevent creating duplicate passkeys for the same passkey provider using
[`excludeCredentials`](https://web.dev/articles/webauthn-exclude-credentials).
* [Use the AAGUID to identify the passkey
provider](https://web.dev/articles/webauthn-aaguid) and to name the credential
for the user.
* Signal if an attempt to register a passkey fails with
[`PublicKeyCredential.signalUnknownCredential()`](https://developer.chrome.com/docs/identity/webauthn-signal-api#signal-that-a-credential-does-not-exist).
* [Send a notification to the
user](https://web.dev/articles/passkey-registration#send_a_notification_to_the_user)
after creating and registering a passkey for their account.
### Learning resources
* [Create a passkey for passwordless
logins](https://web.dev/articles/passkey-registration) * [Server-side passkey
registration](https://developers.google.com/identity/passkeys/developer-guides/server-registration)
* [Implement passkeys with form autofill in a web
app](https://goo.gle/passkeys-codelab)
Create your account
