Skip to Content
Delmare Digital

Client

Build the browser auth client from @delmaredigital/payload-better-auth/client, with typed plugin methods or the preconfigured shortcut.

@delmaredigital/payload-better-auth/client re-exports createAuthClient from better-auth/react and twoFactorClient from better-auth/client/plugins, and adds two shortcuts.

Typed client (recommended)

For this passkey example, install the optional package and configure its server plugin as well. Configure the server's two-factor plugin before calling two-factor methods; see Two-factor authentication.

npm i @better-auth/passkey

List each client plugin inline. Their methods (for example client.twoFactor.verifyTotp) are then typed on the returned client:

src/lib/auth/client.ts
'use client'

import { createAuthClient, twoFactorClient } from '@delmaredigital/payload-better-auth/client'
import { passkeyClient } from '@better-auth/passkey/client'

export const authClient = createAuthClient({
  plugins: [twoFactorClient(), passkeyClient()],
})

export const { useSession, signIn, signUp, signOut, twoFactor, passkey } = authClient

Shortcuts

A preconfigured client with the core plugin (twoFactorClient()). Use it when you need no optional plugins.

src/lib/auth/client.ts
'use client'

import { createPayloadAuthClient } from '@delmaredigital/payload-better-auth/client'

export const authClient = createPayloadAuthClient()
export const { useSession, signIn, signUp, signOut } = authClient

createPayloadAuthClient({ baseURL }) takes one option. baseURL defaults to window.location.origin, which Better Auth expands to <origin>/api/auth. With a non-default Payload routes.api, pass the full mount instead.

Why the shortcuts are typed loosely

Since 0.7.0, payloadAuthPlugins and createPayloadAuthClient() are typed as BetterAuthClientPlugin[] so the generated declaration files stay portable. They work at runtime, but plugin methods such as twoFactor.verifyTotp are not typed on the returned client. List plugins inline when you need typed plugin methods.

The client module does not import optional peers such as @better-auth/passkey or @better-auth/api-key. Import their client plugins yourself when you use them.

Edit this page on GitHub

On this page