Authenticate with Passkey

The user must have already signed in via another method (e.g. email/password, social, etc.) and added a passkey to their account before they can use it to sign in with.You can prompt a user to add a passkey to their account using your SDK’s passkey registration method (see SDK-specific Tabs).

Dashboard Configuration

Simply toggle on “Passkey” in the Log in & User Profile section of the developer console.

Prerequisites

Before this: create and initialize a Dynamic client (see Creating a Dynamic Client, Initializing the Dynamic Client).

React Native: signInWithPasskey() is identical, but passkeys need extra native setup — install react-native-passkey, set metadata.universalLink, and configure associated domains (iOS) / asset links (Android). See React Native Passkeys before using the code below.

Usage

JavaScript
React

import { signInWithPasskey } from '@dynamic-labs-sdk/client';

// Call signInWithPasskey to prompt the user to authenticate with a passkey.
// Once the user authenticates with the passkey, they will be signed in.

const handlePasskeySignIn = async () => {
  await signInWithPasskey();
};

import { useSignInWithPasskey } from '@dynamic-labs-sdk/react-hooks';

function PasskeySignInButton() {
  const { mutate: signInWithPasskey, isPending } = useSignInWithPasskey();

  return (
    <button onClick={() => signInWithPasskey()} disabled={isPending}>
      {isPending ? 'Signing in…' : 'Sign in with passkey'}
    </button>
  );
}

Passkeys are bound to the Relying Party ID (RP ID) they were registered under, which is normally your site’s domain. If your users registered passkeys on a different domain, for example a previous domain you are migrating away from, pass that domain as relatedOriginRpId so they can keep signing in with their existing passkeys instead of registering new ones.

JavaScript
React

import { signInWithPasskey } from '@dynamic-labs-sdk/client';

const handlePasskeySignIn = async () => {
  await signInWithPasskey({ relatedOriginRpId: 'old.example.com' });
};

import { useSignInWithPasskey } from '@dynamic-labs-sdk/react-hooks';

const { mutate: signInWithPasskey } = useSignInWithPasskey();

signInWithPasskey({ relatedOriginRpId: 'old.example.com' });

Two conditions apply:

relatedOriginRpId must be the RP ID the passkey was registered under, as a bare hostname such as old.example.com. A full origin like https://old.example.com is also accepted and resolves to the same RP ID.
That domain must link the two origins by hosting https://old.example.com/.well-known/webauthn with your current domain in its origins list:

{ "origins": ["https://app.example.com"] }

This uses the WebAuthn related origins feature. See Related Origin Requests for the underlying mechanism.

Learn

Implement

Authenticate with Passkey

Dashboard Configuration

Prerequisites

Usage

​Dashboard Configuration

​Prerequisites

​Usage

​Signing in with a passkey from a related domain

Dashboard Configuration

Prerequisites

Usage

Signing in with a passkey from a related domain