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

　　当涉及到多语言国际化的项目时，首次加载页面时则需根据用户当前的系统语言或浏览器语言 进行相应的展示。
　一、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代表当前项目使用的语言