Найкращий спосіб визначити локальність користувача в браузері

У мене веб-сайт (Flash), локалізований на десятках мов, і я хочу автоматично визначити значення за замовчуванням залежно від налаштувань браузера користувача, щоб мінімізувати кроки доступу до вмісту.

FYI, я не можу використовувати серверні скрипти через обмеження проксі, тому я думаю, що JavaScript або ActionScript було б доречним для вирішення проблеми.

Запитання:

1. Що було б найкращим методом «відгадати» локальний стан користувача?

2. Чи існують якісь прості класи / функції, які могли б допомогти мені (немає складних пакетів локалізації)? Спеціально для розбиття всіх можливих мов на меншу кількість (у мене є переклади) на розумний спосіб.

3. До якого моменту я можу довірити таке рішення?

4. Будь-які інші шляхи вирішення чи пропозиції?

Правильним способом є перегляд заголовка мови прийому HTTP, що надсилається на сервер. Він містить упорядкований, зважений список мов, які користувач налаштував на свій веб-переглядач.

На жаль, цей заголовок недоступний для читання в JavaScript; все, що ви отримуєте navigator.language, це говорить про те, яка локалізована версія веб-браузера була встановлена. Це не обов'язково те саме, що бажана мова (мови) користувача. На IE ви натомість отримуєте systemLanguage(встановлена ​​ОС мова), browserLanguage(те саме, що language) і userLanguage(налаштована користувачем область ОС), які всі так само не корисні.

Якби мені довелося вибирати між цими властивостями, я б понюхав userLanguageспочатку, повернувшись до нього languageі лише після цього (якщо вони не відповідали жодній доступній мові), дивлячись browserLanguageі, нарешті systemLanguage.

Якщо ви можете помістити сценарій на стороні сервера де-небудь ще в мережі, який просто зчитує заголовок Accept-Language і видаляє його назад як файл JavaScript зі значенням заголовка в рядку, наприклад:

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

тоді ви можете включити <script src>, що вказує на цю зовнішню службу в HTML, і використовувати JavaScript для розбору заголовка мови. Я не знаю жодного існуючого бібліотечного коду для цього, оскільки розбір мови Accept майже завжди робиться на стороні сервера.

Що б ви в кінцевому підсумку не робили, вам, безумовно, потрібна переоцінка користувача, оскільки це завжди здогадується неправильно для деяких людей. Найчастіше найпростіше ввести мовну настройку в URL (наприклад, http: //www.example.com/uk/site vs http: //www.example.com/de/site), і дозволити користувачу натиснути зв’язки між ними. Іноді ви хочете отримати єдину URL-адресу для обох мовних версій; у цьому випадку вам потрібно зберегти налаштування у файлах cookie, але це може заплутати користувачів-агентів без підтримки файлів cookie та пошукових систем.

У Chrome і Firefox 32+, navigator.languages ​​містить масив локалів у порядку користувальницьких налаштувань і є більш точним, ніж navigator.language, однак для того, щоб зробити його сумісним із зворотним ходом (випробуваний Chrome / IE / Firefox / Safari), а потім використовуйте це:

function getLang()
{
 if (navigator.languages != undefined) 
 return navigator.languages[0]; 
 else 
 return navigator.language;
}

Ця стаття пропонує наступні властивості об’єкта навігатора браузера :

• navigator.language (Netscape - Локалізація браузера)
• navigator.browserLanguage (специфічний для IE - локалізована мова браузера)
• navigator.systemLanguage (Специфічний для IE - ОС Windows - Локалізована мова)
• navigator.userLanguage

Згорніть їх у функцію javascript, і ви повинні мати можливість вгадати правильну мову у більшості випадків. Не забудьте виграшно виграти, тому створіть розділ, який містить посилання на вибір мови, так що якщо немає JavaScript або метод не працює, користувач може все-таки прийняти рішення. Якщо це все-таки спрацює, просто схойте діву.

Єдина проблема з цим на клієнтській стороні полягає в тому, що або ви обслуговуєте всі мови для клієнта, або вам доведеться почекати, поки скрипт запуститься і виявить мову, перш ніж запитувати потрібну версію. Можливо, подання найпопулярнішої мовної версії за замовчуванням роздратує найменших людей.

Редагувати: я б другий пропозицією файлів cookie Івана, але переконайтеся, що користувач завжди може змінити мову пізніше; не кожен надає перевагу мові, яку налаштовано за допомогою браузера.

Комбінуючи кілька способів, якими користуються браузери для зберігання мови користувача, ви отримуєте цю функцію:

const getNavigatorLanguage = () => {
  if (navigator.languages && navigator.languages.length) {
    return navigator.languages[0];
  } else {
    return navigator.userLanguage || navigator.language || navigator.browserLanguage || 'en';
  }
}

Спочатку перевіряємо navigator.languagesмасив на його перший елемент.
Тоді отримуємо navigator.userLanguageабо navigator.language.
Якщо це не вдасться, ми отримуємо navigator.browserLanguage.
Нарешті, ми встановлюємо це, 'en'якщо все інше не вдалося.

А ось і сексуальний одноколісний:

const getNavigatorLanguage = () => (navigator.languages && navigator.languages.length) ? navigator.languages[0] : navigator.userLanguage || navigator.language || navigator.browserLanguage || 'en';

Існує різниця між бажаними мовами користувача та локальною системою / браузером.

Користувач може налаштувати бажані мови у браузері, і вони будуть використовуватися для navigator.language(s)запиту ресурсів із сервера для запиту вмісту відповідно до списку мовних пріоритетів.

Однак, локальний режим браузера вирішить, як відобразити номер, дату, час та валюту. Цей параметр є, ймовірно, мовою найвищого рейтингу, але гарантій немає. У Mac та Linux система визначає локальний ланд незалежно від переваг мови користувача. У Windows можна обирати серед мов у списку бажаних в Chrome.

Використовуючи Intl ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl ), розробники можуть змінити / встановити локаль, який використовується для візуалізації цих речей, але є елементи, які не можна перекрити, наприклад <input type="date">формат.

Для правильного вилучення цієї мови я знайшов єдиний спосіб:

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

( Intl.NumberFormat().resolvedOptions().localeтакож, здається, працює)

Це створить новий екземпляр NumberFormat для локальної мови за замовчуванням, а потім зчитує локальну мову цих вирішених параметрів.

Я трохи провів дослідження з цього приводу, і я підсумував свої висновки донизу в таблиці нижче

Тому рекомендованим рішенням є написання сценарію на серверному сервері для розбору Accept-Languageзаголовка та передачі його клієнтові для встановлення мови веб-сайту. Дивно, що для того, щоб сервер знадобився для виявлення мовних уподобань клієнта, але це так, як зараз. Існують інші різні хаки для виявлення мови, але читання Accept-Languageзаголовка є рекомендованим рішенням, наскільки я розумію.

Ви також можете спробувати отримати мову з документа, який може бути вашим першим портом дзвінка, а потім повернутися до інших засобів, оскільки часто люди хочуть, щоб їх мова JS відповідала мові документа.

HTML5:

document.querySelector('html').getAttribute('lang')

Спадщина:

document.querySelector('meta[http-equiv=content-language]').getAttribute('content')

Жодне справжнє джерело не обов'язково на 100% надійне, оскільки люди можуть просто викласти невірною мовою.

Існують бібліотеки виявлення мови, які можуть дозволяти вам визначати мову за змістом.

Я використав усі відповіді та створив єдине рядкове рішення:

const getLanguage = () => navigator.userLanguage || (navigator.languages && navigator.languages.length && navigator.languages[0]) || navigator.language || navigator.browserLanguage || navigator.systemLanguage || 'en';

console.log(getLanguage());

Ви сказали, що на вашому веб-сайті є Flash, то, як інший варіант, ви можете отримати мову операційної системи за допомогою flash.system.Capabilities.language- див. Як визначити мову ОС у браузері, щоб відгадати мову операційної системи.