js判断当前系统语言、浏览器语言

2021-08-25 16:05:22 阅读：233 来源： 互联网

标签：cookieLang 语言 language js cookie 浏览器 navigator

　　当涉及到多语言国际化的项目时，首次加载页面时则需根据用户当前的系统语言或浏览器语言进行相应的展示。
　一、navigator对象

　　Navigator 对象包含有关浏览器的信息。根据MDN Navigator的介绍，Navigator参数可兼容各大浏览器。

　　其中，navigator.language和navigator.languages 两个属性中包含了浏览器的相关语言信息：

我们一般采用language属性，如果是“zh-CN”，则代表当前的浏览器是中文的环境。

注：navigator.language仅可代表浏览器语言，并不能代表当前系统语言.。

　　有时会存在这种情况，在windows中的chrome或者Firefox浏览器在系统语言为英文的环境中，navigator.language仍旧是“zh-CN”，即通过js只能够获取浏览器的属性系统，而获取不到系统的语言类型。
验证：1、在chrome浏览器中设置语言环境，选择使用英语显示界面，此时英语自动被移动置为第一位语言，这时查看属性发现navigator.language获取到了第一个语言含有“en”字段的了。
　　原因：

　　综上可知：navigator.language 代表的不是浏览器的语言，而是用户更偏好的语言。

二、如何获取系统语言呢？

　　国际化项目中一般都有一个用户可以自行切换语言的按钮，当用户的chrome语言设置为中文，而在使用的项目中选择把页面切换为英语界面时，此时如果想获取语言就需要同时判断浏览器语言和当前操作语言了。
　　

　　这时一般会把项目当前语言存入本地缓存或cookie中，下述代码为如何从cookie中获取语言：

//获取cookie中的默认语言
export const getCookieLang = function() {
  let strcookie = document.cookie; //获取cookie字符串
  let arrcookie = strcookie.split(";"); //分割
  let cookieLang = "";
  for (let i = 0; i < arrcookie.length; i++) {
    let arr = arrcookie[i].split("=");
    //当cookie语言相关的键名为：org.springframework.web.servlet.i18n.CookieLocaleResolver.LOCALE
    if (
      arr &&
      arr[0].trim() ==
        "org.springframework.web.servlet.i18n.CookieLocaleResolver.LOCALE"
    ) {
      cookieLang = arr[1];
      break;
    }
  }
  return cookieLang;
};

获取浏览器语言：

// 获取浏览器默认语言
export const getBrowserLang = function() {
  let browserLang = navigator.language
    ? navigator.language
    : navigator.browserLanguage;
  let defaultBrowserLang = "";
  if (
    browserLang.toLowerCase() === "us" ||
    browserLang.toLowerCase() === "en" ||
    browserLang.toLowerCase() === "en_us"
  ) {
    defaultBrowserLang = "en_US";
  } else {
    defaultBrowserLang = "zh_CN";
  }
  return defaultBrowserLang;
};

此时，当前系统语言通过 cookie存储的语言和浏览器语言同时判断：

// 获取当前系统语言（首先从cookie里获取，默认为浏览器当前的语言）
let cookieLang = getCookieLang();
cookieLang = cookieLang === "en" || cookieLang === "us" ? "en_US" : cookieLang;
const lang = cookieLang || getBrowserLang();
console.log(lang)        //这里的lang代表当前项目使用的语言

标签：cookieLang,语言,language,js,cookie,浏览器,navigator
来源： https://www.cnblogs.com/morango/p/15185442.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

js判断当前系统语言、浏览器语言