How to implement Passkeys

Question

I'm trying to learn more about Apple Passkeys. I use firebase as a backend and it seems like actually integrating it in my site is a hassle without having a custom backend… Are there any solutions for Passkeys+Firebase implementation? Can't really find anything online.

score 6 · Answer 1 · answered Aug 18 '22 at 15:45

I'll echo what Tim has stated, when searching for materials you'll have better luck searching for WebAuthn rather than Passkeys.

The architecture diagram on this page may help you conceptualize what you might need. While the nomenclature is geared to AWS, rather than Google/Firebase, the main idea stays the same (especially because it's centered around a serverless architecture)

This github issue indicates that Firebase auth doesn't support WebAuthn MFA out of the box. So if you want to support Passkeys entirely out of Firebase you'll need to either create a custom auth flow, or explore integrating with another Identity Provider.

If you're not looking to developing something custom, I'd recommend finding an identity prover that supports WebAuthn out of the box. Otherwise, I've got some additional developer guidance here.

Beyond an identity provider, if you are looking for a custom build you need to ensure:

That you build flows on your client application to support WebAuthn
You have databases to store WebAuthn credentials
Database for authentication requests, and registration requests (for challenge validation).

score 5 · Accepted Answer · answered Aug 19 '22 at 16:59

There are services to help you implement passkeys. They wrap passkeys to make it simpler to integrate even with something like firebase.

I recommend reading about Passkeys at https://passkeys.com they have great documentation there as well.

Second, you should check out apple docs:

https://developer.apple.com/documentation/authenticationservices/public-private_key_authentication/supporting_passkeys

Here’s a tutorial found on Youtube that helped me integrate it into my site : https://youtu.be/5A7ZP-Pex3k

score 2 · Answer 3 · answered Jun 13 '23 at 13:47

Install FirebaseWebAuthn. I developed it for personal projects but it got accepted into the Extensions Hub when it opened recently. It's free and very easy to use:

import { createUserWithEmailAndPassword } from "firebase/auth";
import { createUserWithPasskey }          from "@firebase-web-authn/browser";

// framework-agnostic pseudocode:

class SignUpComponent {

  constructor(
    private readonly auth: Auth,
    private readonly functions: Functions,
  ) {
    // Firebase JavaScript SDK usage
    this
      .createUserWithEmailAndPassword = (email: string, password: string) => createUserWithEmailAndPassword(auth, email, password)
      .then(() => void(0));

    // FirebaseWebAuthn usage
    this
      .createUserWithPasskey = (name: string) => createUserWithPasskey(auth, functions, name)
      .then(() => void(0));

  }

  public readonly createUserWithEmailAndPassword: (email: string, password: string) => Promise<void>;
  public readonly createUserWithPasskey: (name: string) => Promise<void>;

}

I'd recommend looking at SimpleWebAuthn: https://simplewebauthn.dev/

This is used in the FirebaseWebAuthn! Can confirm it's great to work with.

[...] a firebase extension for passkeys called justpass.me. It is a very simple and powerful way to enable passwordless biometric authentication into your Firebase web and mobile apps.

This is not true. I looked into their solution and mine is much better in terms of speed and security. Theirs involves extra round trips with multiple servers, has a very clunky API, and has no way of confirming biometrics were used from your server code. I'm only trashing it because it costs $29/mo + ¢10/user to put a public key in a database and it's built like a student project. There is no reason to ever pay for passkey management, there are just people taking advantage of the novelty.

score 0 · Answer 4 · answered Aug 03 '23 at 22:43

I had the same question and went through the process of implementing it myself. Then I extracted it into a gem.

If you're interested in using the gem or learning more about the implementation details of webauthn/passkeys, check out the passkeys-rails gem and the companion iOS example app.

score -2 · Answer 5 · answered Aug 18 '22 at 13:25

Developer resources are currently being built and will be available this fall. For the time being, any resources about supporting WebAuthn with discoverable credentials can be used. "passkey" is just the end user name for discoverable WebAuthn credentials and is not specific to Apple.

I'd recommend looking at SimpleWebAuthn: https://simplewebauthn.dev/

How to implement Passkeys

5 Answers5