# createCroctMiddleware

Learn how to expose the Croct visitor context to your loaders and actions.

This function creates a route middleware for **[React Router 7](https://reactrouter.com)** Hydrogen apps.

Add it to your root route's `middleware` export so loaders and actions receive the Croct visitor context through the `context` they get. Pair it with the [cookie writer](/reference/sdk/hydrogen/api/setup/write-croct-cookies) in your server entry to persist the visitor cookies on the response.

[Remix](https://remix.run) has no route middleware, so use the [context helper](/reference/sdk/hydrogen/api/setup/create-croct-context) instead.

## Signature

This function has the following signature:

```ts
function createCroctMiddleware(options?: CroctOptions): MiddlewareFunction;
```

## Example

Register the middleware on your root route:

**app/root.tsx**

```tsx
import {createCroctMiddleware} from '@croct/plug-hydrogen/server';

export const middleware = [createCroctMiddleware()];
```

## Parameters

The following list describes the supported parameters:

- `options`: `object` (optional)

  The resolver options.

  - `userIdResolver`: `(context: ResolverContext) => Promise<string | null>` (optional)

    The function that resolves the ID of the logged-in customer for the current request.

    It receives the [Hydrogen request context](/reference/sdk/hydrogen/api/types/resolver-context) and returns the user ID, or nothing for anonymous visitors.

    By default, the SDK reads the logged-in customer's ID from the Shopify Customer Account API.

  - `localeResolver`: `(context: ResolverContext) => Promise<string | null>` (optional)

    The function that resolves the preferred content locale for the current request.

    It receives the [Hydrogen request context](/reference/sdk/hydrogen/api/types/resolver-context) and returns a [BCP‑47](https://www.rfc-editor.org/info/bcp47) locale, or nothing to use the workspace default.

    By default, the SDK derives the locale from the storefront's `i18n` configuration, such as `en-US`.
