前端 JavaScript 获取用户浏览器默认语言设置，自动判断跳转不同网站

效果演示

演示地址：https://www.gopekka.com ,

您可以打开上面的链接，会看到 URL 会自动的跳转；中文环境的用户会跳到中文站，同理英文用户会跳到英文网站；

因为我们只做了 2 个版本的，所以其它的语言，也是给跳到 英文网站了；

这种方案需要注意：跳转后的网站里，一定要有一个供用户进行手动切换版本的功能，这样的体验会更好；

效果的原理

根据识别用户的浏览器语言，自动判断并跳转到相应的语言网页，让你的网站更加灵动。

以下需要将代码放在 HTML 的内即可，然后自行制作多语言页面。

代码如下

<script type="text/javascript">
//获取用户语言的顺序是
//1.获取本地缓存里的内容
//2.用户浏览器的语言设置
//如果上面2个都没有获取到，就直接使用'en'作为用户选择的语言
var language = localStorage.getItem('locale') || window.navigator.language.toLowerCase() || 'en'

//把用户的语言写入缓存，供下次获取使用
localStorage.setItem('locale', language)

//判断用户的语言，跳转到不同的地方
if (language.indexOf("zh-") !== -1) {
    window.location = '/zh-cn/index.html'
} else if (language.indexOf('en') !== -1) {
    window.location = '/en/index.html'
} else {
    //其它的都使用英文
    window.location = '/en/index.html'
}
</script>

核心代码

其实核心代码就是利用 navigator 的 language 属性

navigator.language

注意事项

这种方式，是中心枢纽根据用户环境进行分发；

这就需要开发人员自己部署多套网站，一般是这样的解决方案

根据用户环境判断，会导致一个情况：中国大陆内的用户，设置英文为首选语言，那么访问网站会被移到对应的英文网站，这样的处理本是没有事情的，但是遇到傻逼的产品经理，可能会感觉应该默认给送到中文网站；

第二种解决方案

可以通过获取用户的 IP，然后把 IP 放到 IP 库里查询所在地，从而加载对应的资源，这样的方案回更加准确！有的第三方会直接返回所在国家的编码，比如 cn / en 等就更好了

但是这样的方案也有一个弊端：如果用户通过科学上网，全局模式下，会被认为属于美国 / 日本等等（看梯子的 IP 而定了），那么会导致访问非常慢；但是这种偏差，很多翻墙的人都是了解的，没人会故意用美国的 IP 访问国内的淘宝 / 百度等网站的，除非是忘记切换回来了；

IP 判断

市场上有很多 IP 判断的，拿 IP 倒是非常好做的一件事；比如我现在可以拿到用户访问本网站时候的 IP；

如下：