使用 navigator.language 获取用户的区域

Question

一段时间以来，我一直在使用类似这样的方法来获取用户所在的国家/地区 (ISO-3166)：

const region = navigator.language.split('-')[1]; // 'US'

我一直假设字符串类似于en-US——国家/地区将占据第二位 的数组。

我认为这个假设是不正确的。 According to MDN docs, navigator.language returns: "string representing the language version as defined in BCP 47." Reading BCP 47，主要语言子标签保证是第一个（例如，'en'），但区域代码不保证是第二个子标签。在区域子标签之前和之后可以有子标签。

例如 "sr-Latn-RS" 是一个有效的 BCP 47 语言标签：

sr                |  Latn           |  RS
primary language  |  script subtag  |  region subtag

从 navigator.language 返回的值是否是仅包含语言和区域的 BCP 47 子集？或者是否有通常用于从语言标签中提取区域子标签的库或正则表达式？

Answer 1

您的解决方案基于浏览器的语言标签与用户所在国家/地区可靠匹配的错误前提。例如，我将我的浏览器语言设置为德语，即使我现在住在德国附近，而是在美国。

此外，例如在 Chrome 中，许多语言包不要求您指定区域修饰符。将 Chrome 的显示语言设置为德语

提供以下语言标签：

> navigator.language
< "de"

完全没有地区标签，而且是一种相当通用的语言。

最重要的是，即使我住在美国，我的浏览器设置也会生成语言标记 de。

确定用户位置的一种更准确且可能更可靠的方法是从与请求关联的 IP 地址中获取位置。有许多服务提供此服务。 ip-api.com就是其中之一：

$.get("http://ip-api.com/json", function(response) {
  console.log(response.country);     // "United States"
  console.log(response.countryCode); // "US"
}, "jsonp");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

在 Firefox 中，您可以在首选项中选择语言设置：

语言列表有 269 项，其中 192 项不包含任何区域代码。

只有当一种语言根据位置有不同的变体时，该区域才有用。通过这种方式，用户可以告诉服务器他们希望响应使用哪种语言变体。

不要使用这种方法来定位用户。太不可靠了，因为用户可能没有指定任何区域，或者因为用户可能身在另一个地方。

如果要定位用户，应该使用Geolocation API。

Answer 3

在此处找到正则表达式：https://github.com/gagle/node-bcp47/blob/master/lib/index.js

var re = /^(?:(en-GB-oed|i-ami|i-bnn|i-default|i-enochian|i-hak|i-klingon|i-lux|i-mingo|i-navajo|i-pwn|i-tao|i-tay|i-tsu|sgn-BE-FR|sgn-BE-NL|sgn-CH-DE)|(art-lojban|cel-gaulish|no-bok|no-nyn|zh-guoyu|zh-hakka|zh-min|zh-min-nan|zh-xiang))$|^((?:[a-z]{2,3}(?:(?:-[a-z]{3}){1,3})?)|[a-z]{4}|[a-z]{5,8})(?:-([a-z]{4}))?(?:-([a-z]{2}|\d{3}))?((?:-(?:[\da-z]{5,8}|\d[\da-z]{3}))*)?((?:-[\da-wy-z](?:-[\da-z]{2,8})+)*)?(-x(?:-[\da-z]{1,8})+)?$|^(x(?:-[\da-z]{1,8})+)$/i;

let foo = re.exec('de-AT');      // German in Austria
let bar = re.exec('zh-Hans-CN'); // Simplified Chinese using Simplified script in mainland China

console.log(`region ${foo[5]}`); // 'region AT'
console.log(`region ${bar[5]}`); // 'region CN'

Answer 4

正如@TimoSta所说，

试试这个

$.getJSON('http://freegeoip.net/json/', function(result) {
   alert(result.country_code);
});

来自 Get visitors language & country code with javascript (client-side)。见@noducks

的回答

Answer 5

小心你有 navigator.language 和 navigator.languages。

语言：

 console.log(navigator.language); // "fr"

语言：

 console.log(navigator.languages); // ["fr", "fr-FR", "en-US", "en"]

要查找国家/地区，请参阅 Wikipedia on ISO 3166-1 或使用 javascript lib :

Answer 6

您收到的值来自 HTTP 请求的 Accept-Language header。

header 的值可能非常复杂，例如

Accept-Language: da, en-GB;q=0.8, en;q=0.7

顾名思义，Accept-Language header 基本上定义了可接受的语言，而不是国家/地区。

语言标签可能还包含其他位置信息，如 'en-GB'，但其他语言标签如 'en' 则不包含。

以防万一，没有关于该国家/地区的信息。

也不总是能够准确地将 'en' 之类的语言映射到一个国家/地区。如果语言是 'en'，国家可能是 'GB'，但也可能是 'US'。

你能做什么；

如果语言包含一个国家，则只确定国家/地区，如 'en-GB'
如果语言不包含国家/地区，您有以下选择：
一些语言只在一个国家/地区使用，例如 'da'，丹麦语仅在丹麦使用（我在这里猜测），因此您可以映射这些案例。
您可以在其他情况下使用默认值，具体取决于语言，例如将 'en' 映射到 'GB'
对于无法确定国家/地区的所有情况，您可以使用 'US' 这样的通用默认值。
您可以使用其他信息，例如确定国家/地区的客户端 IP 地址
最后你可能会要求用户输入国家

我收集了一些关于 Accept-Language header here

的额外信息

Answer 7

您现在可以使用国际化 API 中的 Locale 对象从语言环境标识符中提取区域。

const { region } = new Intl.Locale('sr-Latn-RS') // region => 'RS'

请注意，这目前与 Internet Explorer 不兼容。

使用 navigator.language 获取用户的区域

Getting the user's region with navigator.language

javascript

locale

iso-3166

ietf-bcp-47

语言：

语言：