---
createdAt: 2025-05-20
updatedAt: 2025-06-29
title: Come recuperare la locale dai cookie / header?
description: Scopri come recuperare la locale dai cookie / header.
keywords:
  - cookie
  - header
  - intlayer
  - locale
  - hook
  - useLocale
  - useLocaleCookie
  - next.js
  - react-intlayer
  - vue-intlayer
slugs:
  - frequent-questions
  - get-locale-cookie
---

# Come recuperare la locale dai cookie / header

## Uso degli Hooks (Consigliato)

Per la maggior parte dei casi d'uso, è consigliato recuperare la locale corrente usando l'hook `useLocale` perché viene risolto automaticamente. Questo funziona in modo simile al composable `useLocale` in Vue.js.

```ts
import { useLocale } from "next-intlayer";
// oppure import { useLocale } from "react-intlayer";
// oppure import { useLocale } from "vue-intlayer";

ts;
// Uso lato client
const { locale } = useLocale();
```

Per i componenti server, puoi importarlo da:

```tsx
import { useLocale } from "next-intlayer/server";

const Test = () => {
  const { locale } = useLocale();
  return <>{locale}</>;
};

const Page = async ({ params }) => {
  const { locale } = await params;

  return (
    <IntlayerServerProvider locale={locale}>
      <Test />
    </IntlayerServerProvider>
  );
};
```

Esiste anche un hook `useLocaleCookie` che risolve solo il valore del cookie.

## Configurazione manuale del cookie

Puoi dichiarare un nome personalizzato per il cookie come

```ts
import { type IntlayerConfig } from "intlayer";

const config: IntlayerConfig = {
  middleware: {
    cookieName: "myCustomLocaleCookie", // il valore predefinito è 'intlayer-locale'
  },
};

export default config;
```

il recupero come

### Lato client

```ts
// Uso del nome cookie predefinito
const locale = document.cookie
  .split("; ")
  .find((row) => row.startsWith("intlayer-locale="))
  ?.split("=")[1];

// Uso di un nome cookie personalizzato
const locale = document.cookie
  .split("; ")
  .find((row) => row.startsWith("myCustomLocaleCookie="))
  ?.split("=")[1];
```

### Lato server (Next.js)

```ts
import { cookies } from "next/headers";

// Uso del nome cookie predefinito
const locale = cookies().get("intlayer-locale")?.value;

// Uso di un nome cookie personalizzato
const locale = cookies().get("myCustomLocaleCookie")?.value;
```

### Se la locale non è ancora impostata

La locale viene impostata come cookie solo una volta che l'utente seleziona esplicitamente la locale. Per impostazione predefinita, per i nuovi visitatori, la locale viene interpretata dai campi degli header.

Puoi rilevare la locale preferita dall'utente dagli header della richiesta. Ecco un esempio di come gestirlo:

```ts
/**
 * Rileva la locale dagli header della richiesta
 *
 * L'header accept-language è il più importante per il rilevamento della locale.
 * Contiene una lista di codici lingua con valori di qualità (q-values) che indicano
 * le lingue preferite dall'utente in ordine di preferenza.
 *
 * Esempio: "en-US,en;q=0.9,fr;q=0.8,es;q=0.7"
 * - en-US è la lingua primaria (q=1.0 è implicito)
 * - en è la seconda scelta (q=0.9)
 * - fr è la terza scelta (q=0.8)
 * - es è la quarta scelta (q=0.7)
 */
import { localeDetector } from "@intlayer/core";

/**
 * Esempio di header di negoziazione che i browser tipicamente inviano
 * Questi header aiutano a determinare la lingua preferita dall'utente
 */
const exampleNegotiatorHeaders: Record<string, string> = {
  "accept-language": "en-US,en;q=0.9,fr;q=0.8,es;q=0.7",
  "accept":
    "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8",
  "user-agent":
    "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36",
};

// Esempio di utilizzo:
const detectedLocale = localeDetector(exampleNegotiatorHeaders);
```
