WebAuthn/Passkeys support

[RihanArfan]

Feature request

Is your feature request related to a problem? Please describe.

No, it's purely a nice feature I would like to see.

I would like WebAuthn to be supported in Supabase Auth. Auth0 will be adding support for WebAuthn which you can see through their flows preview here (sidebar -> WebAuthn).

Describe the solution you'd like

Adding support for registering and logging in using WebAuthn, or allowing it to be used as two-factor authentication.

Describe alternatives you've considered

It is possible to implement it myself for my own projects though I'm sure others may like this feature in the SDK/part of auth, and it'd set Supabase ahead in modern compared to Firebase.

Additional context

[tacurran]

@LeCodeCo please take a look at https://www.github.com/ory/kratos its open source , headless, and there are some similar applications in the Ory community. We also plan a PR here to help in the same direction. Also see this https://www.ory.sh/hydra/docs/next/advanced/

[kiwicopple]

Great idea @LeCodeCo - I'm transferring this to our GoTrue repo to implement it in the Auth server. Also, thanks for the amazingly detailed feature request. The screen mockups are great

[jswhisperer]

I'm watching you feature 👀

[J0]

I'm going to move this under our MFA thread #14 So please feel free to following along over there instead.

Thanks!

[RihanArfan]

@J0 While WebAuthn is great for 2FA (and can be tracked in #14), this issue also covers using it as the primary authentication method to replace username/passwords

[J0]

Hey @LeCodeCo ,

That's fair -- thanks for highlighting that -- let's leave this open then.

Lmk if there are any further questions or concerns!

[RichiCoder1]

Wanted this echo the use of this as both a method of MFA, but also as a password alternative (down with passwords!).

[J0]

Hey @RichiCoder1,

Were there any other auth services that you were considering that provide Webauthn as a password alternative(outside of MFA)? We'd love to see what's available out there and what the DX looks like.

Would also love to understand the immediate use case if any (e.g. for instance one might want anonymous sign-in's because it'd help with implementing a cart feature for the e-commerce app that they are building).

We're probably not going to build it out just yet but both these pointers would be helpful in envisioning what an experience could look like if we were to build it out

Let me know!

[snorremd]

Would also love to understand the immediate use case if any (e.g. for instance one might want anonymous sign-in's because it'd help with implementing a cart feature for the e-commerce app that they are building).

If nothing else the use case is protecting users from phishing attacks increasing the security of the user compared to the password flow. This is accomplished by Webauthn binding the authentication key of the user to a specific origin URL. Thus the browser won't try logging in even if presented with the correct public key from a phishing server.

For my own use case I think the Webauth based signup and login flow could wholly replace the password flow as it is both more convenient and more secure. It also makes it possible to sign up users without any form of personally identifying information which is good for GDPR.

[RihanArfan]

These may be of interest:

• https://www.apple.com/newsroom/2022/05/apple-google-and-microsoft-commit-to-expanded-support-for-fido-standard/
• https://blog.google/technology/safety-security/one-step-closer-to-a-passwordless-future/
• https://fidoalliance.org/white-paper-multi-device-fido-credentials/

[J0]

Hey all,

Unfortunately, after much internal discussion, we have decided to focus on SAML and Multi-Factor Authentication. As such, we won't be implementing Webauthn as a a first factor sign in method in the near future.

Consequently, we will close this issue for now but will re-visit re-open when the time is right. For now, feel free to fork GoTrue or open a Github Discussion if you'd like to explore this further -- we'd be happy to jump in there.

Sorry about this!

[bdougherty]

I'm very confused about why this is not being considered and when you think the time will be right. Apple, Google, and Microsoft are all heavily invested in and committed to Passkeys.

[jswhisperer]

@LeCodeCo please take a look at https://www.github.com/ory/kratos its open source , headless, and there are some similar applications in the Ory community. We also plan a PR here to help in the same direction. Also see this https://www.ory.sh/hydra/docs/next/advanced/

Looks good!

[J0]

Hey all,

We hear you and we're not closed to passkeys - it's simply the case that we were prioritizing other important features like MFA and SAML. As such, we wouldn't be able to promise a release date in the immediate future(2022).

Since Passkeys also make use of the FIDO2(Webauthn) spec it should be easier to make a case after we've added Webauthn support. We're looking into FIDO2 support for MFA devices so we ask for your patience with that.

In the meantime, we ask that you indicate interest in the feature via the main comment https://github.com/supabase/gotrue/issues/92#issue-874184379 so we can best convey the demand for the feature.

Thanks!

[maxcountryman]

@J0 since you're asking folks for feedback and want to indicate interest level, it would be nice if this issue could stay open. It being closed could signal that this is not something Supabase will add at all. If there's a better place to track interest, that's great and I'd love to know where that is.

[ioucyf]

In my humble opinion, I think WebAuthn should be a priority.

It's not that complicated to implement, and makes for a significantly secure method while being very cost effective on all kinds of resources; as first class and mfa.

[milovangudelj]

Would love to see this implemented and fully supported out of the box. It would greatly improve the user experience and security without needing second factors.

For now I think I'll try making an example webiste using Matthew Miller's SimpleWebAuthn package and Next.js.

[chrisciszak]

In the new age of privacy, passkeys / webauthn support as primary and MFA method is super important.

Has anyone ever implemented this or is there an open branch with ongoing development on this?

[EskelCz]

@J0 It's been a year, any update of plans for 2023? Passkeys are the way.

[J0]

Hey @EskelCz,

We're currently prioritising a few other key building blocks such as Anonymous Logins and Auth Hooks. Unfortunately, it seems unlikely that this will move forward this year. We wish to be certain of the security model and the developer experience (particularly on mobile) around it before releasing such a feature.

If it would help at all I can also push up a private fork with a WebAuthn implementation which I worked on the side for a bit for people to play around with and give feedback. This would be purely experimental and I won't be able to make any guarantees around the security model or that GoTrue will be accepting any of the code in the fork.

If it's a blocker for the team please sound off via this thread or file feedback via the Supabase dashboard with the use case. We go through all pieces of feedback and will take it into consideration.

We're sorry about this and we appreciate your understanding on the matter.

[chrisciszak]

Hey @J0 thank you for providing a proper update on this.

Could you expand what anonymous login will be about and if you have rough delivery timeline for this?

Thanks

[J0]

Hey @chrisciszak,

No worries, thanks for your patience with us. You can check out this issue for further details about Anonymous logins as well as the timeline.

[darosior]

Hey there, we are also very interested in using WebAuthn as a passwordless login method (as well as an MFA).

@J0 thank you for following up with us about this feature request. It's been 4 months since your last message on the matter. Has anything changed? Can we hope for WebAuthn in 2024?

[fluid-design-io]

Hey @chrisciszak @milovangudelj ,

I've managed to intergrade @simplewebauthn with Supabase by creating a custom schema & RLS to it. Here's how I designed the UI to "merge" the WebAuthn with Supabase TOTP.

It's a bit of a hack as I don't want to issue custom JWTs and have to modify the supabase middleware/server/client header settings (using the @supabase/ssr package). Additionally, I also need to support regular email/phone login in parallel. As a result, I used this to generate a hashed_token and pass it to the PKCE flow route handler to redeem the session.

//auth/web-authn/verify-authentication
//...
const magicLink = await supabaseAdmin.auth.admin.generateLink({
    email,
    type: 'magiclink',
  })

const magicUrl = `${process.env.NEXT_PUBLIC_SITE_URL}/auth/confirm?token_hash=${magicLink.data.properties?.hashed_token}&type=magiclink&redirect_to=${process.env.NEXT_PUBLIC_SITE_URL}`

return NextResponse.json({ verified, magicLink: magicUrl })

The downside of this is the user auth does not have aal2 level when you call supabase.auth.mfa.getAuthenticatorAssuranceLevel(), it would be aal2 if you've registered using supabase.auth.mfa.enroll() & verify user via supabase.auth.mfa.verify(). Here's the doc I used to create the Supabase MFA flow.

Overall I think this gets the job done for now, but is no where close to a native implementation as it relies on a 3rd party package and need to manually setup, maintain and adapt future changes.

Any suggestions to make this flow better? Happy to provide more info.

[Radiergummi]

It's a bit of a hack as I don't want to issue custom JWTs and have to modify the supabase middleware/server/client header settings (using the @supabase/ssr package). Additionally, I also need to support regular email/phone login in parallel. As a result, I used this to generate a hashed_token and pass it to the PKCE flow route handler to redeem the session. [...] Any suggestions to make this flow better? Happy to provide more info.

Couldn't you, theoretically, also validate the WebAuthn assertion, reset the user's password to a random string, then issue a password login using this random password immediately? I mean that's a despicable hack really, but probably pretty smooth to the user.

[ProductOfAmerica]

@J0 no problem, I’d love to request the ability to login to Supabase securely using a Yubikey or similar FIDO authentication method. Thanks!

[axelinternet]

Any updates regarding the roadmap on this? User expectations seem to be moving in this direction, both from devs and end users perspective

[J0]

Hey

Folks, thanks for patiently waiting - we're re-considering this. We're hoping to disambiguate between three potential cases:

1. Request for support of webauthn for sign in and registration (passkeys) - 🎉
2. Request for support of webauthn as an MFA method on your application which is on Supabase- 🚀
3. Request for use of webauthn as an MFA method to log in to Supabase Platform - 😄

Separately, also keen to hear what are the best browser / client SDKs you've used around webauthn

Do you mind reacting to this post with the appropriate emoji if you have the time? Don't quite have a better way of polling within a Github atm unfortunately. You can react with more than one emoji if you'd like multiple use cases.

If your use case is not covered feel free to make a fresh comment

[Radiergummi]

@J0 I don't know if this helps; I implemented webauthn for sign in and registration on top of Supabase in a SvelteKit app, using the excellent SimpleWebauthn library. Users without an authenticator can login using OTPs via email, will be offered to add an authenticator post successful login, and can subsequently sign in using their PassKey. In their account management area, they can manage previously registered authenticators.

This wasn't possible using the built-in authentication capabilities of Supabase (I tried), so I had to sidestep and create my own authentication database schema.

I'm mentioning this because I've implemented WebAuthn support in a few different projects and am reasonably confident my implementation is standards-compliant, as straightforward as possible and secure, so it may be helpful to see how an actual real-world setup might look like.
If you're interested, I can take some time and extract the relevant code and database schema into a sample repository.

[ioucyf]

@J0 I don't know if this helps; I implemented webauthn for sign in and registration on top of Supabase in a SvelteKit app, using the excellent SimpleWebauthn library. Users without an authenticator can login using OTPs via email, will be offered to add an authenticator post successful login, and can subsequently sign in using their PassKey. In their account management area, they can manage previously registered authenticators.

This wasn't possible using the built-in authentication capabilities of Supabase (I tried), so I had to sidestep and create my own authentication database schema.

I'm mentioning this because I've implemented WebAuthn support in a few different projects and am reasonably confident my implementation is standards-compliant, as straightforward as possible and secure, so it may be helpful to see how an actual real-world setup might look like. If you're interested, I can take some time and extract the relevant code and database schema into a sample repository.

This is exactly the flow I'm trying to implement with WebAuthn. 1- Send OTP code via email for first timers, or those without passkey/authenticator. 2- One registered, they are offered to register either a passkey or/and authenticator (as mean for future logins) 3- future authentications done via passkey/authenticator if available, else, email OTPs as a fallback.

In my opinion, this is exactly how I want to implement all my authentications. The option to also offer the user to use either other method (or all three should they choose to) to further secure their accounts.

// *chef's kiss*

Thank you very much sir for sharing. 🙏

[avcohen]

@J0 I don't know if this helps; I implemented webauthn for sign in and registration on top of Supabase in a SvelteKit app, using the excellent SimpleWebauthn library. Users without an authenticator can login using OTPs via email, will be offered to add an authenticator post successful login, and can subsequently sign in using their PassKey. In their account management area, they can manage previously registered authenticators.

This wasn't possible using the built-in authentication capabilities of Supabase (I tried), so I had to sidestep and create my own authentication database schema.

I'm mentioning this because I've implemented WebAuthn support in a few different projects and am reasonably confident my implementation is standards-compliant, as straightforward as possible and secure, so it may be helpful to see how an actual real-world setup might look like. If you're interested, I can take some time and extract the relevant code and database schema into a sample repository.

Been following this for a while and I'd love to see this as well!

[J0]

Users without an authenticator can login using OTPs via email, will be offered to add an authenticator post successful login, and can subsequently sign in using their PassKey. In their account management area, they can manage previously registered authenticators.

Thanks all! We'll take this into consideration.

I'm mentioning this because I've implemented WebAuthn support in a few different projects and am reasonably confident my implementation is standards-compliant, as straightforward as possible and secure, so it may be helpful to see how an actual real-world setup might look like. If you're interested, I can take some time and extract the relevant code and database schema into a sample repository.

Would be keen but don't want to do so if it requires more than ten minutes of overhead on your end. The Simplewebauthn library looks great - only trouble there is that it seems to be in JavaScript while our service is written in Go. If we move forward it's likely we'll use an existing Webauthn golang package as it'd be hard to make the case for writing a port.

The browser bindings will definitely be relevant though - keen to hear feedback / opinions about browser bindings there and elsewhere if anyone has opinions to offer.

[probert94]

I am not sure if this has already been discussed here but I would like to have some kind of support for adding new devices. To add a new passkey (i.e. new device), you first have to log in to the app. Usually that means you log in using username + password and then add your passkey. However, that means, that the account still needs username + password. As the ultimate goal of passkeys is to get rid of passwords, there should be an alternative way to add a passkey / device.

[smndtrl]

@J0 As you have recently added WebAuthn functionality for MFA, do you have updates on Passkeys/WebAuthn as the main means of authentication?

[J0]

Hey @smndtrl,

Thanks for checking in. It's planned but still under discussion - feel free to post any suggestions / feedback here and the team will do their best to take it into account

[smndtrl]

Thanks for the status update @J0

We have two different apps/scenarios where we are using Passkeys

Passkey only (fast, private and simple)

1. User arrives on page and the page and conditional UI flow triggers so users with existing discoverable credentials can quickly sign back in
2. A button triggers passkey signup. We don’t collect any more information during that phase.
3. Only when a user decides to go for a paid tier we collect more information

E-mail verified + multiple Passkeys

1. As above
2. A email input + button triggers a e-mail validation (though e-mail + OTP is not allowed as a sign in factor)
3. Confirming the email, the user is asked to signup 2 passkeys (1 syncable passkey + 1 device bound passkey) where we might restrict which authenticators can be used

All future logins are done with either of the (at least) 2 discoverable credentials/passkeys and the e-mail is no longer necessary

[chrisciszak]

Hey @smndtrl,

Thanks for checking in. It's planned but still under discussion - feel free to post any suggestions / feedback here and the team will do their best to take it into account

Hey @J0 - could you share roughly when is this planned for?

[J0]

For passkeys, best guess would be sometime in 2025

[cbracegirdle]

Hi @Radiergummi

@J0 I don't know if this helps; I implemented webauthn for sign in and registration on top of Supabase in a SvelteKit app, using the excellent SimpleWebauthn library. Users without an authenticator can login using OTPs via email, will be offered to add an authenticator post successful login, and can subsequently sign in using their PassKey. In their account management area, they can manage previously registered authenticators.

This wasn't possible using the built-in authentication capabilities of Supabase (I tried), so I had to sidestep and create my own authentication database schema.

I'm mentioning this because I've implemented WebAuthn support in a few different projects and am reasonably confident my implementation is standards-compliant, as straightforward as possible and secure, so it may be helpful to see how an actual real-world setup might look like. If you're interested, I can take some time and extract the relevant code and database schema into a sample repository.

This is exactly what I want to do. It would be amazing if you were able to share your code, or at least some more hints!

[Radiergummi]

Hi @Radiergummi

@J0 I don't know if this helps; I implemented webauthn for sign in and registration on top of Supabase in a SvelteKit app, using the excellent SimpleWebauthn library. Users without an authenticator can login using OTPs via email, will be offered to add an authenticator post successful login, and can subsequently sign in using their PassKey. In their account management area, they can manage previously registered authenticators. This wasn't possible using the built-in authentication capabilities of Supabase (I tried), so I had to sidestep and create my own authentication database schema. I'm mentioning this because I've implemented WebAuthn support in a few different projects and am reasonably confident my implementation is standards-compliant, as straightforward as possible and secure, so it may be helpful to see how an actual real-world setup might look like. If you're interested, I can take some time and extract the relevant code and database schema into a sample repository.

This is exactly what I want to do. It would be amazing if you were able to share your code, or at least some more hints!

Oh my, this is embarrassing. I completely forgot about this issue, had a lot of stuff keeping me away from Open Source work. Take a look at the source repository over here: https://github.com/project-kiosk/kiosk/tree/next/src/routes/auth

I didn't get around to documenting things yet, so feel free to reach out if you need help, or open an issue in the kiosk repository, and I'll respond there.

The system works roughly like so:

1. On the login page, the login page component initializes the WebAuthn autocomplete for the email input field, if WebAuthn is available in that browser (it falls back to a passcode otherwise)
2. If that works, a challenge is requested from the assertion endpoint
3. When the user interacts with the input and confirms the ceremony, the assertion is verified (which also sets the session cookie) and the user will be redirected to the home page.

The fallback process sends out an OTP via email, then offers an OTP form which, after successful submission, will check if the user has no registered Passkeys yet and offer to register one before the post-login home page redirect.

Some of these things are a bit SvelteKit-specific, so to reproduce this in other applications, you'd want these things (simplified to make it easier to explain):

1. An assertion (ie., login—"assert this user is known") challenge generation endpoint (e.g. /auth/assertion/challenge): This really just requests a challenge for an existing Passkey, so by solving the challenge, users can prove they own the Passkey
2. An assertion challenge verification endpoint (e.g. /auth/assertion/verify): This endpoint accepts the solution to a previously requested challenge
3. An attestation (ie., registration—"attest this Passkey belongs to that user") challenge generation endpoint (e.g. /auth/attestation/challenge): Similar to assertions, generates a challenge for a logged-in user
4. An attestation challenge verification endpoint (e.g. /auth/attestation/verify): Accepts a solution to a previously requested challenge and persists the Passkey details in the database for later usage.

Since a full login flow always requires several requests (fetching the login page, requesting the challenge, verifying it), you also need a session mechanism to ensure a challenge can only be verified by the client that has requested its generation.

So much for the quick summary of Webauthn—make sure to read up on it before actually implementing it :) Again, I'm happy to help if you have other questions.

[cullophid]

Hey

Folks, thanks for patiently waiting - we're re-considering this. We're hoping to disambiguate between three potential cases:

1. Request for support of webauthn for sign in and registration (passkeys) - 🎉
2. Request for support of webauthn as an MFA method on your application which is on Supabase- 🚀
3. Request for use of webauthn as an MFA method to log in to Supabase Platform - 😄

Separately, also keen to hear what are the best browser / client SDKs you've used around webauthn

Do you mind reacting to this post with the appropriate emoji if you have the time? Don't quite have a better way of polling within a Github atm unfortunately. You can react with more than one emoji if you'd like multiple use cases.

If your use case is not covered feel free to make a fresh comment

My main use case is to offer passkeys as a way for my users to sign in to my platform. I assume that is what is meant by 1.?