页面能不能使用用户浏览器设置的语言作为默认语言？
yaofly2012 opened this issue · comments
背景
某天正在奋力coding的时候，忽然收到领导发来的一个小窗。咦？难道要给我加工资？
咱们页面能不能使用用户浏览器设置的语言作为默认语言？
额，原来是加需求。
实现
1. Navigator.language
一开始的思路是先想办法在前端获取到用户浏览器设置的语言，所有就google：js get browser language，接着就发现了navigator.language属性。看了解释貌似能实现领导需求。
但是仔细想了下貌似有点问题，首先页面是SSR渲染的，SSR渲染时并不能获取到浏览器的语言设置呀。
2. HTTP Accept-Language首部
The
Accept-Languagerequest HTTP header indicates the natural language and locale that the client prefers
看解释这个才是解决方案，可以在服务端获取客户端的语言设置。
2.1 浏览器语言设置和Accept-Language关系：
以我的Chrome浏览器为例：
可以看到我设置了3中语言，其中英文为首选语言。再看下请求的Accept-Language首部值：
更新下浏览器语言设置，会发现Accept-Language首部也更新调整，即两者是一致的：
2.2 Accept-Language值
Accept-Language: en-US,en;q=0.9,zh-CN;q=0.8,zh;q=0.7多个语言用逗号隔开，每个非首选的语言后面可能会被;q=xx修饰，即权重值，权重从左到右权重逐渐递减。
总结就是Accept-Language值是一个被权重标记的有序字符串。