nextauthjs/next-auth · error · TypeError

Provider id "${provider}" refers to a WebAuthn provider. Ple

Error message

Provider id "${provider}" refers to a WebAuthn provider.
Please use `import { signIn } from "next-auth/webauthn"` instead.

What it means

The generic signIn helper from "next-auth/react" refuses to handle WebAuthn providers in v5; passkeys must go through the dedicated signIn in "next-auth/webauthn". When the resolved provider's type is "webauthn", this TypeError is thrown to redirect you to the correct entry point.

Source

Thrown at packages/next-auth/src/react.tsx:271

  if (!providers) {
    const url = `${baseUrl}/error`
    window.location.href = url
    return // TODO: Return error if `redirect: false`
  }

  if (!provider || !providers[provider]) {
    const url = `${baseUrl}/signin?${new URLSearchParams({
      callbackUrl: redirectTo,
    })}`
    window.location.href = url
    return // TODO: Return error if `redirect: false`
  }

  const providerType = providers[provider].type

  if (providerType === "webauthn") {
    // TODO: Add docs link with explanation
    throw new TypeError(
      [
        `Provider id "${provider}" refers to a WebAuthn provider.`,
        'Please use `import { signIn } from "next-auth/webauthn"` instead.',
      ].join("\n")
    )
  }

  const signInUrl = `${baseUrl}/${
    providerType === "credentials" ? "callback" : "signin"
  }/${provider}`

  const csrfToken = await getCsrfToken()
  const res = await fetch(
    `${signInUrl}?${new URLSearchParams(authorizationParams)}`,
    {
      method: "post",
      headers: {
        "Content-Type": "application/x-www-form-urlencoded",

View on GitHub (pinned to a1a16a5a77)

Solutions

1. Import signIn from "next-auth/webauthn" and call it with the WebAuthn provider id
2. Keep using "next-auth/react" signIn only for credentials/oauth/email providers
3. Route dynamically: check the provider type against your providers list and pick the matching signIn

Example fix

// before
import { signIn } from "next-auth/react"
signIn("webauthn") // TypeError
// after
import { signIn } from "next-auth/webauthn"
signIn("webauthn")

const providers = await getProviders()
if (providers?.[providerId]?.type === "webauthn") {
  const { signIn } = await import("next-auth/webauthn")
  return signIn(providerId)
}
const { signIn } = await import("next-auth/react")
return signIn(providerId)

function isWebAuthnProviderId(
  providers: Record<string, { type: string }> | null,
  id: string
): boolean {
  return providers?.[id]?.type === "webauthn"
}

try {
  await reactSignIn(providerId)
} catch (e) {
  if (e instanceof TypeError && e.message.includes("webauthn")) {
    const { signIn } = await import("next-auth/webauthn")
    await signIn(providerId)
  } else throw e
}

When it happens

Trigger: Calling `signIn("webauthn")` (or any provider id whose type is "webauthn") imported from "next-auth/react".

Common situations: Upgrading a v4 passkey sign-in flow that used the generic react signIn; copy-pasting a signIn("webauthn") call from older docs; mixing the react and webauthn entry points in one component.

Related errors

• Provider id "${provider}" does not refer to a WebAuthn provi
• Provider must be WebAuthn
• Provider id "${provider}" does not refer to a WebAuthn provi
• [next-auth]: `useSession` must be wrapped in a <SessionProvi
• Authenticator not found.

AI-assisted analysis of nextauthjs/next-auth@a1a16a5a77 (2026-08-28). Data as JSON: /api/errors/cd77d9c6353fc475. Report an issue: GitHub.