# General Translation React SDKs (gt-react, gt-next): createNextMiddleware
URL: https://generaltranslation.com/es/docs/react/nextjs/reference/functions/create-next-middleware.mdx
---

title: createNextMiddleware
description: Agrega enrutamiento y detección por configuración regional a una aplicación de Next.js con General Translation. Referencia de API de createNextMiddleware.

---

La función `createNextMiddleware` de `gt-next/middleware` agrega enrutamiento y detección basados en la configuración regional a una aplicación de Next.js. Detecta la configuración regional de cada visitante, la guarda en una cookie y lo redirige a la versión localizada de una página.

Usa la [guía de middleware de App Router](/docs/react/nextjs/app-router-middleware) o la [guía de middleware de Pages Router](/docs/react/nextjs/pages-router-middleware) para la configuración específica del router.

## Descripción general [#overview]

Crea el middleware y expórtalo, junto con un path matcher, desde tu archivo de middleware. Colócalo en la raíz del proyecto — `proxy.ts` en Next.js 16+ o `middleware.ts` en Next.js 15 y versiones anteriores — no dentro de `app/` ni de `pages/`.

```ts title="proxy.ts"
import { createNextMiddleware } from 'gt-next/middleware';

export default createNextMiddleware();

export const config = {
  // Coincide con todas las rutas excepto rutas de API, archivos estáticos e internos de Next.js
  matcher: ['/((?!api|static|.*\\..*|_next).*)'],
};
```

## Cómo funciona [#how-it-works]

El middleware determina la configuración regional de cada solicitud a partir de estas fuentes, en este orden:

1. **Configuración regional de la URL** — un prefijo de configuración regional en la ruta, como `/es/about`.
2. **Cookie** — la configuración regional seleccionada previamente por el visitante.
3. **Cabeceras del navegador** — la cabecera `Accept-Language`.
4. **Configuración regional predeterminada** — tu `defaultLocale` configurado como valor predeterminado.

Luego establece una cookie de configuración regional y, cuando `localeRouting` está habilitado, redirige o reescribe a la ruta localizada correcta. De forma predeterminada, `defaultLocale` no lleva prefijo (`/about` sigue siendo `/about`), mientras que las demás configuraciones regionales sí (`/es/about`). Los códigos de configuración regional se estandarizan a su forma canónica cuando los servicios de General Translation están habilitados, y las configuraciones regionales no compatibles generan una advertencia en tiempo de compilación.

## Opciones [#options]

`createNextMiddleware` toma un único objeto de opciones. Todos los campos son opcionales.

| Opción                                          | Descripción                                                                    | Tipo      | Opcional | Predeterminado |
| ----------------------------------------------- | ------------------------------------------------------------------------------ | --------- | -------- | -------------- |
| [`localeRouting`](#locale-routing)              | Habilita el enrutamiento basado en la configuración regional.                  | `boolean` | Sí       | `true`         |
| [`prefixDefaultLocale`](#prefix-default-locale) | Añade también a la URL el prefijo de la configuración regional predeterminada. | `boolean` | Sí       | `false`        |
| [`ignoreSourceMaps`](#ignore-source-maps)       | Omite las solicitudes de mapas de origen de Next.js.                           | `boolean` | Sí       | `true`         |
| [`pathConfig`](#path-config)                    | Sobrescrituras de rutas localizadas.                                           | `object`  | Sí       | `{}`           |

*Nota: para restringir en qué rutas se ejecuta el middleware, configura [`pathRegex`](/docs/react/nextjs/config#path-regex) en `withGTConfig`; no es una opción del middleware. El `matcher` de tu `config` exportado es lo que Next.js usa para decidir si el middleware se ejecuta en absoluto.*

### `localeRouting` [#locale-routing]

**Tipo** `boolean` · **Opcional** · **Predeterminado** `true`

Habilita el enrutamiento basado en la configuración regional y las redirecciones. Cuando es `false`, el middleware sigue detectando y almacenando la configuración regional, pero no añade prefijos de configuración regional ni reescribe las rutas.

### `prefixDefaultLocale` [#prefix-default-locale]

**Tipo** `boolean` · **Opcional** · **Predeterminado** `false`

Cuando es `false` (el valor predeterminado), la configuración regional predeterminada se sirve sin prefijo (`/about`), mientras que las demás sí llevan prefijo (`/es/about`). Cuando es `true`, todas las configuraciones regionales llevan prefijo, incluida la predeterminada (`/en/about`).

### `ignoreSourceMaps` [#ignore-source-maps]

**Tipo** `boolean` · **Opcional** · **Predeterminado** `true`

Cuando es `true`, las solicitudes de mapas de origen de Next.js se transfieren sin modificaciones.

### `pathConfig` [#path-config]

**Tipo** `object` · **Opcional** · **Predeterminado** `{}`

Asocia rutas compartidas con rutas localizadas, de modo que una ruta pueda tener una URL distinta para cada configuración regional. Cada clave es la ruta compartida; cada valor es una única ruta localizada o un mapa por configuración regional. Los segmentos dinámicos, como `[id]`, se conservan.

```ts title="proxy.ts"
export default createNextMiddleware({
  pathConfig: {
    // Inglés: /products, Chino: /zh/产品
    '/products': {
      zh: '/产品',
    },
    // Rutas dinámicas: /product/123, /zh/产品/123
    '/product/[id]': {
      zh: '/产品/[id]',
    },
  },
});
```

## Ejemplo [#example]

```ts title="proxy.ts"
import { createNextMiddleware } from 'gt-next/middleware';

export default createNextMiddleware({
  prefixDefaultLocale: true,
  pathConfig: {
    '/about': {
      fr: '/a-propos',
    },
  },
});

export const config = {
  matcher: ['/((?!api|static|.*\\..*|_next).*)'],
};
```

*Advertencia: prueba bien tu matcher. Un matcher demasiado amplio puede provocar bucles de redirección o hacer que los recursos estáticos dejen de funcionar.*