关于javascript：在浏览器中确定用户区域设置的最佳方式


Best way to determine user's locale within browser

我有一个本地化为十几种语言的网站(Flash)，我想根据用户的浏览器设置自动定义默认值，以便最大限度地减少访问内容的步骤。

仅供参考，由于代理限制，我无法使用服务器脚本，因此我猜JavaScript或ActionScript适合解决问题。

问题：

  • 什么是"猜测"用户的语言环境的最佳方法？

  • 是否有任何现有的简单类/功能可以帮助我(没有复杂的本地化捆绑)？ 特别是以智能方式将所有可能的语言分解为较小的数字(我有的翻译)。

  • 我可以相信这样的解决方案？

  • 还有其他解决方法或建议吗？

    • 相关讨论

    正确的方法是查看发送到服务器的HTTP Accept-Language标头。这包含用户已将其浏览器配置为首选的语言的有序加权列表。

    很遗憾，此标头无法在JavaScript中读取;所有你得到的是navigator.language，它告诉你安装了什么本地化版本的Web浏览器。这不一定与用户的首选语言相同。在IE上，您将获得systemLanguage(操作系统安装语言)，browserLanguage(与language相同)和userLanguage(用户配置的操作系统区域)，这些都同样无益。

    如果我必须在这些属性之间做出选择，我会首先嗅探userLanguage，然后再回到language并且只在那之后(如果那些与任何可用语言不匹配)查看browserLanguage，最后systemLanguage 。

    如果您可以在网络上的其他位置放置一个服务器端脚本，它只读取Accept-Language标头并将其作为JavaScript文件返回，并带有字符串中的标头值，例如：

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

    然后你可以在HTML中包含指向该外部服务的

    本文建议浏览器导航器对象的以下属性：

    • navigator.language(Netscape - 浏览器本地化)
    • navigator.browserLanguage(IE-Specific - 浏览器本地化语言)
    • navigator.systemLanguage(IE-Specific - Windows操作系统 - 本地化语言)
    • navigator.userLanguage

    将这些转换为javascript函数，您应该能够在大多数情况下猜出正确的语言。一定要优雅地降级，所以有一个div包含你的语言选择链接，这样如果没有javascript或方法不起作用，用户仍然可以决定。如果它确实有效，只需隐藏div。

    在客户端执行此操作的唯一问题是，您要么将所有语言提供给客户端，要么必须等到脚本运行并在请求正确版本之前检测到语言。也许提供最流行的语言版本作为默认会激怒最少的人。

    编辑：我是第二个Ivan的cookie建议，但请确保用户以后可以随时更改语言;不是每个人都喜欢他们的浏览器默认的语言。

    相关讨论

    结合浏览器用于存储用户语言的多种方式，您可以获得以下功能：

    1
    2
    3
    4
    5
    6
    7
    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'。

    这是性感的单线：

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

    我做了一些关于这个＆amp; amp;到目前为止，我已在下表中总结了我的发现

    enter image description here

    所以推荐的解决方案是编写一个服务器端脚本来解析Accept-Language标题和放大器。将其传递给客户端以设置网站的语言。奇怪的是，为什么需要服务器来检测客户端的语言偏好，但现在的情况就是如此。还有其他各种黑客可用于检测语言，但根据我的理解，读取Accept-Language标头是推荐的解决方案。

    用户的首选语言与系统/浏览器区域设置之间存在差异。

    用户可以在浏览器中配置首选语言，这些语言将用于navigator.language(s)，并在从服务器请求资源时使用，以根据语言优先级列表请求内容。

    但是，浏览器区域设置将决定如何呈现数字，日期，时间和货币。此设置可能是排名最高的语言，但无法保证。在Mac和Linux上，无论用户语言首选项如何，语言环境都由系统决定。在Windows上，可以在Chrome的首选列表中的语言中选出。

    通过使用Intl(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl)，开发人员可以覆盖/设置用于呈现这些内容的语言环境，但是有一些元素可以无法覆盖，例如格式。

    要正确提取这种语言，我发现的唯一方法是：

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

    (Intl.NumberFormat().resolvedOptions().locale似乎也有效)

    这将为默认语言环境创建一个新的NumberFormat实例，然后回读那些已解析选项的语言环境。

    您也可以尝试从文档中获取语言应该是您的第一个停靠点，然后再回到其他方式，因为人们通常希望他们的JS语言与文档语言匹配。

    HTML5：

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

    遗产：

    <5233>

    没有真正的资源必然是100％可靠的，因为人们可以简单地使用错误的语言。

    有一些语言检测库可以让您按内容确定语言。

    你说你的网站有Flash，那么，作为另一种选择，你可以用flash.system.Capabilities.language＆mdash;获得操作系统的语言。请参阅如何在浏览器中确定OS语言以猜测操作系统区域设置。