# General Translation React SDKs (gt-react, gt-next, gt-react-native): Middleware для App Router
URL: https://generaltranslation.com/ru/docs/react/nextjs/app-router-middleware.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: Как настроить маршрутизацию по локалям General Translation для Next.js App Router.

Настройте middleware, корневой сегмент `[locale]` и функцию определения локали запроса, чтобы запросы App Router направлялись по правильному локализованному маршруту.

## Настройте middleware [#middleware]

Создайте `proxy.ts` в корне вашего проекта (`middleware.ts` в Next.js 15 и более ранних версиях):

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

export default createNextMiddleware();

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

Middleware определяет локаль по URL, cookie-файлу, заголовкам браузера или локали по умолчанию. Затем он перенаправляет запрос на соответствующий локализованный маршрут или переписывает его.

## Добавьте маршрут локали [#locale-route]

Переместите страницы App Router в `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>

Этот сегмент маршрута получает локаль, выбранную в middleware. Параметры маршрутизации, [алиасы локализованных путей](/docs/react/nextjs/reference/functions/create-next-middleware#path-config) и [реализации страниц для конкретных локалей](/docs/react/nextjs/reference/functions/create-next-middleware#route-overrides) см. в [`createNextMiddleware`](/docs/react/nextjs/reference/functions/create-next-middleware).

<Callout type="info">
  **Рендеринг во время запроса:** вы можете оставить root layout в `app/layout.tsx`
  и разместить в `app/[locale]` только страницы. Вызывайте
  [`getLocale`](/docs/react/nextjs/reference/functions/get-locale) из
  root layout; middleware передаёт локаль запроса, поэтому отдельный
  `getLocale.ts` не нужен. При prerendering используйте функцию запроса, описанную ниже,
  так как middleware не выполняется во время статической генерации.
</Callout>

## Получение корневой локали [#root-locale]

Создайте `getLocale.ts` в корне проекта. `withGTConfig` автоматически найдет этот файл.

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

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

Параметр root передаёт локаль без чтения заголовков запроса или cookie-файлов.

<Callout type="info">
  **Next.js 15.2–15.4:** `next/root-params` доступен в Next.js 15.5 и
  более поздних версиях. В версиях 15.2–15.4 импортируйте `unstable_rootParams` из `next/server`
  и возвращайте вместо него `(await unstable_rootParams())?.locale`. Параметры root
  недоступны ни в каком виде до версии 15.2, поэтому определяйте локаль из запроса
  в этих версиях.
</Callout>

## Переключение локалей [#locale-switching]

Когда посетитель меняет локаль, `gt-next` сохраняет выбор в cookie-файле и обычно обновляет серверные компоненты вызовом `router.refresh()`.

Если посетитель переключается на локаль по умолчанию, а текущий URL разрешается в другую локаль, браузер перезагружает страницу, чтобы middleware мог переписать pathname. Например, если локаль по умолчанию используется без префикса, `/fr/about` превращается в `/about`.

## Отклонение неподдерживаемых локалей [#validate-locales]

По умолчанию при неподдерживаемой локали запроса выводится предупреждение и используется `defaultLocale`. Для строгих маршрутов с префиксом локали проверьте параметр маршрута в `app/[locale]/layout.tsx` и вызовите `notFound()`:

```tsx title="app/[locale]/layout.tsx"
import { isLocaleSupported } from 'gt-next';
import { notFound } from 'next/navigation';

export default async function LocaleLayout({
  children,
  params,
}: {
  children: React.ReactNode;
  params: Promise<{ locale: string }>;
}) {
  const { locale } = await params;

  if (!isLocaleSupported(locale)) {
    notFound();
  }

  return (
    <html lang={locale}>
      <body>{children}</body>
    </html>
  );
}
```

[`isLocaleSupported`](/docs/react/nextjs/reference/functions/is-locale-supported) принимает настроенные алиасы локалей и сужает тип значения до `string`. Middleware не преобразует неизвестный сегмент маршрута в ошибку 404 автоматически.

## Next steps

- /docs/react/nextjs/app-router-static-site-generation
- /docs/react/nextjs/registering-request-locales
- /docs/react/nextjs/cache-components
- /docs/react/nextjs/locale-alias-seo

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.