# General Translation React SDKs (gt-react, gt-next): middleware de App Router
URL: https://generaltranslation.com/es/docs/react/nextjs/app-router-middleware.mdx
---
title: middleware de App Router
description: Cómo configurar el enrutamiento por configuración regional de General Translation para el App Router de Next.js.
related:
  links:
    - /docs/react/nextjs-quickstart
    - /docs/react/nextjs/app-router-static-site-generation
    - /docs/react/nextjs/reference/functions/create-next-middleware

---

Configure el middleware, un segmento raíz `[locale]` y una función para la configuración regional de la solicitud, de modo que las solicitudes del App Router se resuelvan a la ruta localizada correcta.

## Configura el middleware [#middleware]

Crea `proxy.ts` en el directorio raíz de tu proyecto (`middleware.ts` en Next.js 15 y versiones anteriores):

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

export default createNextMiddleware();

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

El middleware detecta la configuración regional a partir de la URL, la cookie, las cabeceras del navegador o la configuración regional predeterminada. Luego redirige o reescribe la solicitud a la ruta localizada que corresponda.

## Añade la ruta de la configuración regional [#locale-route]

Mueve las páginas de tu App Router a `app/[locale]`:

<Files>
  <Folder name="app">
    <Folder name="[locale]">
      <File name="layout.tsx" />

      <File name="page.tsx" />
    </Folder>
  </Folder>

  <File name="getLocale.ts" />

  <File name="proxy.ts" />
</Files>

El segmento de la ruta recibe la configuración regional seleccionada por el middleware. Consulta [`createNextMiddleware`](/docs/react/nextjs/reference/functions/create-next-middleware) para ver las opciones de enrutamiento y la configuración de rutas localizadas.

## Lee la configuración regional del directorio raíz [#root-locale]

Crea `getLocale.ts` en el directorio raíz del proyecto. `withGTConfig` detecta este archivo automáticamente.

```ts title="./getLocale.ts"
import { locale } from 'next/root-params';

export default async function getLocale() {
  return await locale();
}
```

El parámetro raíz proporciona la configuración regional sin leer las cabeceras de la solicitud ni las cookies.
## Next steps

- /docs/react/nextjs-quickstart
- /docs/react/nextjs/app-router-static-site-generation
- /docs/react/nextjs/reference/functions/create-next-middleware