¿Cómo puedo determinar la configuración regional de un usuario dentro del navegador?

Resuelto Theo.T asked hace 15 años • 10 respuestas

Tengo un sitio web (Flash) localizado en una docena de idiomas y quiero definir automáticamente un valor predeterminado según la configuración del navegador del usuario para minimizar los pasos para acceder al contenido.

Para su información, no puedo utilizar scripts del servidor debido a restricciones de proxy, por lo que supongo que JavaScript o ActionScript serían apropiados para resolver el problema.

Preguntas:

  1. ¿Cuál sería el mejor método para "adivinar" la ubicación del usuario?

  2. ¿Existen clases/funciones simples que puedan ayudarme (sin paquetes de localización complejos)? Sobre todo para reducir todos los idiomas posibles a un número menor (las traducciones que tengo) de forma inteligente.

  3. ¿Hasta qué punto puedo confiar en tal solución?

  4. ¿Alguna otra solución o sugerencia?

Theo.T avatar Mar 23 '09 22:03 Theo.T
Aceptado

La forma correcta es mirar el encabezado HTTP Accept-Language enviado al servidor. Contiene la lista ordenada y ponderada de idiomas que el usuario ha configurado en su navegador.

Lamentablemente, este encabezado no está disponible para leer dentro de JavaScript; todo lo que obtiene es navigator.language, que le indica qué versión localizada del navegador web se instaló. Esto no es necesariamente lo mismo que el idioma preferido del usuario. En IE, en su lugar obtienes systemLanguage(idioma instalado del sistema operativo), browserLanguage(igual que language) y userLanguage(región del sistema operativo configurada por el usuario), que son igualmente inútiles.

Si tuviera que elegir entre esas propiedades, buscaría userLanguageprimero, volvería a languagey solo después de eso (si no coincidieran con ningún idioma disponible) miraría browserLanguagey finalmente systemLanguage.

Si puede colocar un script del lado del servidor en algún otro lugar de la red que simplemente lea el encabezado Accept-Language y lo muestre como un archivo JavaScript con el valor del encabezado en la cadena, por ejemplo:

var acceptLanguage= 'en-gb,en;q=0.7,de;q=0.3';

entonces podría incluir un <script src> que apunte a ese servicio externo en el HTML y usar JavaScript para analizar el encabezado del idioma. Sin embargo, no conozco ningún código de biblioteca existente para hacer esto, ya que el análisis de Accept-Language casi siempre se realiza en el lado del servidor.

Independientemente de lo que termine haciendo, ciertamente necesita una anulación del usuario porque algunas personas siempre adivinarán mal. A menudo es más fácil poner la configuración de idioma en la URL (por ejemplo, http​://www.example.com/en/site vs http​://www.example.com/de/site) y dejar que el usuario haga clic vínculos entre ambos. A veces desea una única URL para ambas versiones de idioma, en cuyo caso debe almacenar la configuración en cookies, pero esto puede confundir a los agentes de usuario que no admiten cookies ni motores de búsqueda.

bobince avatar Mar 23 '2009 18:03 bobince

En Chrome y Firefox 32+, Navigator.languagescontiene una variedad de configuraciones regionales en orden de preferencia del usuario y es más preciso que navigator.language, sin embargo, para hacerlo compatible con versiones anteriores (Probado Chrome / IE / Firefox / Safari), luego use esto:

function getLang() {
  if (navigator.languages != undefined) 
    return navigator.languages[0]; 
  return navigator.language;
}
Fiach Reid avatar Jun 30 '2015 10:06 Fiach Reid

Este artículo sugiere las siguientes propiedades del objeto del navegador del navegador :

  • navigator.language(Netscape - Localización del navegador)
  • navigator.browserLanguage(Específico de IE: idioma localizado en el navegador)
  • navigator.systemLanguage(Específico de IE - Sistema operativo Windows - Idioma localizado)
  • navigator.userLanguage

Incorpórelos a una función de JavaScript y debería poder adivinar el idioma correcto, en la mayoría de las circunstancias. Asegúrese de degradar con elegancia, así que tenga un div que contenga los enlaces de elección de idioma, de modo que si no hay javascript o el método no funciona, el usuario aún pueda decidir. Si funciona, simplemente oculta el div.

El único problema al hacer esto en el lado del cliente es que, o entrega todos los idiomas al cliente, o tiene que esperar hasta que el script se haya ejecutado y haya detectado el idioma antes de solicitar la versión correcta. Quizás ofrecer la versión en el idioma más popular como predeterminada irritaría a la menor cantidad de personas.

Editar: apoyaría la sugerencia de cookies de Ivan, pero me aseguro de que el usuario siempre pueda cambiar el idioma más tarde; No todo el mundo prefiere el idioma predeterminado de su navegador.

Phil H avatar Mar 23 '2009 15:03 Phil H

Existe una diferencia entre los idiomas preferidos del usuario y la configuración regional del sistema/navegador.

Un usuario puede configurar los idiomas preferidos en el navegador, y estos se utilizarán navigator.language(s)y se utilizarán al solicitar recursos de un servidor, para solicitar contenido de acuerdo con una lista de prioridades de idioma.

Sin embargo, la configuración regional del navegador decidirá cómo representar el número, la fecha, la hora y la moneda. Esta configuración es probablemente el idioma con la clasificación más alta, pero no hay garantía. En Mac y Linux, la configuración regional la decide el sistema independientemente de las preferencias de idioma del usuario. En Windows se puede elegir entre los idiomas de la lista preferida en Chrome.

Al usar Intl ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl ), los desarrolladores pueden anular/establecer la configuración regional que se usará para representar estas cosas, pero hay elementos que no se pueden anular, como el <input type="date">formato.

Para extraer correctamente este idioma, la única forma que encontré es:

(new Intl.NumberFormat()).resolvedOptions().locale

( Intl.NumberFormat().resolvedOptions().localetambién parece funcionar)

Esto creará una nueva instancia de NumberFormat para la configuración regional predeterminada y luego volverá a leer la configuración regional de esas opciones resueltas.

Patrik Kullman avatar Aug 16 '2019 18:08 Patrik Kullman