> **Can't find what you're looking for?** Use `search_docs` on the docs MCP server at `https://accounts.tempo.xyz/api/mcp` to find what you need.

# `webAuthn`

Creates a Wagmi connector backed by the WebAuthn adapter.

## Usage

```ts
import { createConfig, http } from 'wagmi'
import { tempo } from 'wagmi/chains'
import { webAuthn } from 'wagmi/tempo'

export const config = createConfig({
  chains: [tempo],
  connectors: [webAuthn({ authUrl: '/auth' })],
  transports: {
    [tempo.id]: http(),
  },
})
```

## Parameters

Accepts all [`webAuthn`](/docs/api/webAuthn) adapter options, plus all [`Provider`](/docs/api/provider) options except `adapter`.

### authUrl

* **Type:** `string`
* **Optional**

URL of a [WebAuthn server handler](/docs/server/handler.webAuthn).

:::info
[See the guide](https://docs.tempo.xyz/guide/use-accounts/embed-passkeys)
:::

:::warning
Cannot be used with `ceremony`.
:::

```ts twoslash
import { createConfig, http } from 'wagmi'
import { tempo } from 'wagmi/chains'
import { webAuthn } from 'wagmi/tempo'

export const config = createConfig({
  chains: [tempo],
  connectors: [
    webAuthn({
      authUrl: '/auth', // [!code focus]
    }),
  ],
  transports: { [tempo.id]: http() },
})
```

### accessKey.authorize

* **Type:** `{ address?: Address; chainId?: bigint; expiry: number; keyType?: 'secp256k1' | 'p256' | 'webAuthn'; limits?: { token: Address; limit: bigint; period?: number }[]; privateKey?: Hex; publicKey?: Hex; scopes?: { address: Address; recipients?: Address[]; selector?: Hex | string }[] } | (() => { ... } | undefined)`
* **Optional**

Access-key parameters to authorize automatically when no stored key satisfies a request. Pass an object to use the same parameters for every request, or a function to compute them per request — return `undefined` to skip authorization for that request.

This matches [`Provider`'s `accessKey.authorize`](/docs/api/provider#accesskeyauthorize).

Tempo Wallet-hosted approval pages require at least one `limits` entry and one `scopes` entry. Local adapters accept unbounded keys, but production apps should pass both so local and wallet-hosted flows use the same policy.

```ts twoslash
import { createConfig, http } from 'wagmi'
import { tempo } from 'wagmi/chains'
import { parseUnits } from 'viem'
import { Expiry } from 'accounts'
import { webAuthn } from 'wagmi/tempo'

export const config = createConfig({
  chains: [tempo],
  connectors: [
    webAuthn({
      authUrl: '/auth',
      accessKey: { // [!code focus]
        authorize: { // [!code focus]
          expiry: Expiry.days(7), // [!code focus]
          limits: [{ // [!code focus]
            token: '0x20c0000000000000000000000000000000000001', // [!code focus]
            limit: parseUnits('500', 6), // [!code focus]
          }], // [!code focus]
          scopes: [{ // [!code focus]
            address: '0x20c0000000000000000000000000000000000001', // [!code focus]
            selector: 'transfer(address,uint256)', // [!code focus]
          }], // [!code focus]
        }, // [!code focus]
      }, // [!code focus]
    }),
  ],
  transports: { [tempo.id]: http() },
})
```

### ceremony

* **Type:** `WebAuthnCeremony`
* **Default:** `WebAuthnCeremony.server({ url: authUrl }){:js}`

Ceremony strategy for WebAuthn registration and authentication. [See more](/docs/api/webauthnceremony).

:::info
[See the guide](https://docs.tempo.xyz/guide/use-accounts/embed-passkeys)
:::

:::warning
Cannot be used with `authUrl`.
:::

```ts twoslash
import { createConfig, http } from 'wagmi'
import { tempo } from 'wagmi/chains'
import { WebAuthnCeremony } from 'accounts'
import { webAuthn } from 'wagmi/tempo'

export const config = createConfig({
  chains: [tempo],
  connectors: [
    webAuthn({
      ceremony: WebAuthnCeremony.server({ url: '/auth' }), // [!code focus]
    }),
  ],
  transports: { [tempo.id]: http() },
})
```

### feePayer

* **Type:** `string | { url: string; precedence?: 'fee-payer-first' | 'user-first' }`
* **Optional**

Fee payer configuration for interacting with a service running [`Handler.relay`](/docs/server/handler.relay) from `accounts/server`. Pass a URL string, or an object with `url` and optional `precedence`.

:::info
[See the guide](https://docs.tempo.xyz/guide/payments/sponsor-user-fees)
:::

```ts twoslash
import { createConfig, http } from 'wagmi'
import { tempo } from 'wagmi/chains'
import { webAuthn } from 'wagmi/tempo'

export const config = createConfig({
  chains: [tempo],
  connectors: [
    webAuthn({
      authUrl: '/auth',
      feePayer: 'https://myapp.com/fee-payer', // [!code focus]
    }),
  ],
  transports: { [tempo.id]: http() },
})
```

### mpp

* **Type:** `boolean`
* **Default:** `false`

Enable [Machine Payment Protocol](https://mpp.dev) support.

```ts twoslash
import { createConfig, http } from 'wagmi'
import { tempo } from 'wagmi/chains'
import { webAuthn } from 'wagmi/tempo'

export const config = createConfig({
  chains: [tempo],
  connectors: [
    webAuthn({
      authUrl: '/auth',
      mpp: true, // [!code focus]
    }),
  ],
  transports: { [tempo.id]: http() },
})
```

### testnet

* **Type:** `boolean`
* **Default:** `false`

Use testnet. When `true`, the default chain will be the first testnet chain in `chains`.

```ts twoslash
import { createConfig, http } from 'wagmi'
import { tempo } from 'wagmi/chains'
import { webAuthn } from 'wagmi/tempo'

export const config = createConfig({
  chains: [tempo],
  connectors: [
    webAuthn({
      authUrl: '/auth',
      testnet: true, // [!code focus]
    }),
  ],
  transports: { [tempo.id]: http() },
})
```