上节我们谈到在 AngularJS 里面拿当前浏览器 Locale 的3种方式,本节我们主要讨论下 AngularJS 里面自带的 $locale 服务和用原生 JS 如何获取浏览器 Locale,严谨的角度来说是获取当前用户浏览器的语言列表或者是浏览器UI语言。
首先我们聊下 AngularJS 里面的$locale 服务,很棒的概览,会让人感觉眼前一亮,但当我们研读了它的源码后,我们会有些许的失望:
'use strict';
/**
* @ngdoc service
* @name $locale
*
* @description
* $locale service provides localization rules for various Angular components. As of right now the
* only public api is:
*
* * `id` – `{string}` – locale id formatted as `languageId-countryId` (e.g. `en-us`)
*/
目前为止AngularJS 支持的locale 服务还是很弱, 仅提供了一个locale id的格式接口。那么回到鼻祖原生JS,如何获取浏览器当前的语言或者浏览器UI语言。其实 W3C 定义html5 API 规格里面是这样写的:
- window .
navigator
.language
- Returns a language tag representing the user's preferred language.
而具体到实现,每个浏览器上面的实现是很狂野的。
Internet Explorer
navigator.languagesSorry! 暂不支持。
navigator.userLanguage 返回用户设定的第一个语言,可以在 Internet Options > General > Languages 修改。
navigator.browserLanguage 返回当前浏览器UI语言,用户不能修改。跟安装时选择的可执行文件版本相关。
navigate.systemLanguage 返回当前OS的语言。
Firefox
navigator.language返回用户设定的第一个语言,可以在 Internet Options > General > Languages 修改。
Safari
navigator.systemLanguage 在 Safari里面语言定义是系统层面的,不能在重载。
Chrome
navigator.language 非常坚定,不为用户首选语言而动摇,坚持一个浏览器 UI 语言为方针。但是做人要公道,之前在写 chrome 的插件时,意外发现一个 API 可以返回用户语言列表,这个是一个异步的API。
chrome.i18n.getAcceptLanguages(function(requestedLocales) {
// 'requestedLocales' is an array of strings.
});
不知不觉夜以深,总结下从前端或者从JS的角度获取用户偏好的语言信息有一定难度,主要体现在API的缺失和对应实现的不一致性。
下一个章节我们会谈到如何获取http请求头里面的accept-language和权重信息,以及不同方式之间的差异性。