Çerezlerden / başlıklardan locale nasıl alınır

Hook Kullanımı (Önerilen)

Çoğu kullanım için, mevcut locale'i otomatik olarak çözen useLocale hook'unu kullanmanız önerilir. Bu, Vue.js'deki useLocale composable ile benzer şekilde çalışır.

Kodu kopyala

Kodu panoya kopyala

import { useLocale } from "next-intlayer";// veya import { useLocale } from "react-intlayer";// veya import { useLocale } from "vue-intlayer";// İstemci tarafı kullanımconst { locale } = useLocale();

import { useLocale } from "next-intlayer";// veya import { useLocale } from "react-intlayer";// veya import { useLocale } from "vue-intlayer";// İstemci tarafı kullanımconst { locale } = useLocale();

Sunucu bileşenleri için şuradan içe aktarabilirsiniz:

tsx

Kodu kopyala

Kodu panoya kopyala

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>  );};

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>  );};

Sadece çerez değerini çözen bir useLocaleCookie hook'u da vardır.

Manuel Çerez Yapılandırması

Özel çerez adı tanımlayabilirsiniz:

Kodu kopyala

Kodu panoya kopyala

import { type IntlayerConfig } from "intlayer";const config: IntlayerConfig = {  middleware: {    cookieName: "ozelLocaleCookie", // varsayılan 'intlayer-locale'  },};export default config;

import { type IntlayerConfig } from "intlayer";const config: IntlayerConfig = {  middleware: {    cookieName: "ozelLocaleCookie", // varsayılan 'intlayer-locale'  },};export default config;

ve şu şekilde alabilirsiniz:

İstemci tarafı

Kodu kopyala

Kodu panoya kopyala

// Varsayılan çerez adı ileconst locale = document.cookie  .split("; ")  .find((row) => row.startsWith("intlayer-locale="))  ?.split("=")[1];// Özel çerez adı ileconst locale = document.cookie  .split("; ")  .find((row) => row.startsWith("ozelLocaleCookie="))  ?.split("=")[1];

// Varsayılan çerez adı ileconst locale = document.cookie  .split("; ")  .find((row) => row.startsWith("intlayer-locale="))  ?.split("=")[1];// Özel çerez adı ileconst locale = document.cookie  .split("; ")  .find((row) => row.startsWith("ozelLocaleCookie="))  ?.split("=")[1];

Sunucu tarafı (Next.js)

Kodu kopyala

Kodu panoya kopyala

import { cookies } from "next/headers";// Varsayılan çerez adı ileconst locale = cookies().get("intlayer-locale")?.value;// Özel çerez adı ileconst locale = cookies().get("ozelLocaleCookie")?.value;

import { cookies } from "next/headers";// Varsayılan çerez adı ileconst locale = cookies().get("intlayer-locale")?.value;// Özel çerez adı ileconst locale = cookies().get("ozelLocaleCookie")?.value;

Locale henüz ayarlanmadıysa

Locale, kullanıcı dili açıkça seçtiğinde çerez olarak ayarlanır. Varsayılan olarak, yeni ziyaretçiler için locale başlık alanlarından yorumlanır.

Kullanıcının tercih ettiği locale'i istek başlıklarından tespit edebilirsiniz. İşte nasıl yapılacağına dair bir örnek:

Kodu kopyala

Kodu panoya kopyala

/** * İstek başlıklarından locale tespiti * * accept-language başlığı, locale tespiti için en önemlisidir. * Kullanıcının tercih ettiği dilleri öncelik sırasına göre q-değerleriyle içerir. * * Örnek: "en-US,en;q=0.9,fr;q=0.8,es;q=0.7" * - en-US birincil dil (q=1.0 varsayılır) * - en ikinci tercih (q=0.9) * - fr üçüncü tercih (q=0.8) * - es dördüncü tercih (q=0.7) */import { localeDetector } from "@intlayer/core";/** * Tarayıcıların tipik olarak gönderdiği örnek başlıklar * Bu başlıklar kullanıcının tercih ettiği dili belirlemeye yardımcı olur */const ornekNegotiatorHeaders: 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",};// Kullanım örneği:const tespitEdilenLocale = localeDetector(ornekNegotiatorHeaders);

/** * İstek başlıklarından locale tespiti * * accept-language başlığı, locale tespiti için en önemlisidir. * Kullanıcının tercih ettiği dilleri öncelik sırasına göre q-değerleriyle içerir. * * Örnek: "en-US,en;q=0.9,fr;q=0.8,es;q=0.7" * - en-US birincil dil (q=1.0 varsayılır) * - en ikinci tercih (q=0.9) * - fr üçüncü tercih (q=0.8) * - es dördüncü tercih (q=0.7) */import { localeDetector } from "@intlayer/core";/** * Tarayıcıların tipik olarak gönderdiği örnek başlıklar * Bu başlıklar kullanıcının tercih ettiği dili belirlemeye yardımcı olur */const ornekNegotiatorHeaders: 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",};// Kullanım örneği:const tespitEdilenLocale = localeDetector(ornekNegotiatorHeaders);