问题
本地起服务,访问页面的时候报错,刚还运行的好好的,怎么突然报错了???
经过一系列的排除定位问题,发现可能是因为浏览器版本导致的登陆问题,具体报错如下:
方案
方案一:更改浏览器默认配置
访问网址:chrome://flags/
Schemeful Same-Site禁用,设为disabled后,再重新刷新浏览器,没有报错了
在Chrome 80版本,SameSite的默认值被改为Lax
上述翻译:修改同站点计算,使得具有相同可注册域但不同方案的源被视为跨站点。此更改仅适用于具有“SameSite”属性的 cookie。 – Mac、Windows、Linux、Chrome 操作系统、Android
如果不想改浏览器,怎么办呢?具体原因等会再分析,先说解决方案
方案二:改请求代码
本地服务类似:http://dev.example.cn
后端服务的请求:https://back.example.cn
属于跨域访问,日常开发,本地服务是通过webpack-dev-server的方式启动,通过配置
proxy:{
"/XXX":{
target: "https://login.example.cn",
changeOrigin: true,
secure: false,
}
}
的方式解决跨域
之前代码网络请求地址
chrome版本升级后,该请求地址跨域,无法请求到数据
去掉代码中,定义的后端的常量域名:“https://back.example.cn/”
使后端接口请求地址自动补充为本地服务“http://dev.example.cn” , proxy 代理到测试环境的统一域名请求地址,例如:“https://web.leke.cn”
内容补充
透过这个网站可以检查当前自己的浏览器是否已经更新为最新版本的SameSite规则,全部为绿色则为已开启新规则。
https://samesite-sandbox.glitch.me/