Detectar idioma y redirigir

Resultado

Su navegador está configurado en

Español

La página decide la ruta destino con prioridad a la preferencia guardada y fallback seguro si el navegador no coincide.

Ruta seleccionada /es/ Este es el destino que usaría window.location.replace.

Parámetros de prueba

Idiomas del navegador

Preferencia guardada

Si seleccionas un idioma guardado, ese valor tiene prioridad sobre el navegador.

Su navegador está configurado en Español.

Ruta de fallback: /es/

Código del snippet

const SUPPORTED_LOCALES = {
  es: '/es/',
  en: '/en/',
  fr: '/fr/'
};

const DEFAULT_LOCALE = 'en';
const STORAGE_KEY = 'preferred-locale';

function normalizeLocale(locale) {
  return String(locale || '')
    .toLowerCase()
    .split('-')[0];
}

function getBrowserLocales() {
  const primaryLocale = navigator.language || navigator.userLanguage || DEFAULT_LOCALE;

  return navigator.languages?.length
    ? navigator.languages
    : [primaryLocale];
}

function resolveLocale() {
  const storedLocale = localStorage.getItem(STORAGE_KEY);

  if (storedLocale && SUPPORTED_LOCALES[storedLocale]) {
    return storedLocale;
  }

  for (const locale of getBrowserLocales()) {
    const normalized = normalizeLocale(locale);

    if (SUPPORTED_LOCALES[normalized]) {
      return normalized;
    }
  }

  return DEFAULT_LOCALE;
}

function isCurrentLocalePath(pathname, locale) {
  const targetPath = SUPPORTED_LOCALES[locale];
  return pathname === targetPath || pathname.startsWith(targetPath);
}

function redirectToPreferredLocale() {
  const locale = resolveLocale();

  if (isCurrentLocalePath(window.location.pathname, locale)) {
    return;
  }

  window.location.replace(SUPPORTED_LOCALES[locale]);
}

redirectToPreferredLocale();