How to correctly implement passkeys for web?

34 views Asked by At

No passkeys available

I have a django app and I'm trying to implement passkeys login. Initially user signs up with password and then registers a passkey using either a PC or a phone. When I register passkey using my laptop browser with bitwarden, it saves the passkey into bitwarden and I can sign in again using that passkey. When I do the same with my android phone using firefox, I can successfully register my passkey using fingerprint reader and I can see it in the registered passkeys. But when I try to log in again on my phone, I get "No passkeys available for my-site.com on this device" dialog.

The same thing happens on Github

Interestingly, I get exact same message on github. I registered my passkey on the phone for github and it displays the same dialog on my phone. Using bitwarden I can sign in fine.

No problem on passkeys.io

Following the same steps both on my phone and on my laptop, I can register my passkey and log in using passkey (fingerprint reader opens on android) without any problems on passkeys.io website demo. This proves that it is not an issue about the device I am using or the android version etc. This is the console.log() of the object I am passing to navigator.credentials.get():

publicKey: Object
  challenge: Uint8Array
  rpId: "......106-158.ngrok-free.app"
  timeout: 12000
  userVerification: "preferred"

Any ideas about what is github and my website doing wrong in comparison to what passkeys.io does?

0

There are 0 answers