前后端分离跨域axios无法携带cookie,谷歌浏览器携带cookie丢失

最近在项目开发中遇到一个前后端分离，跨域下用axios请求无法携带cookie的问题，弄了很久，记录一下。

axios默认是发送请求的时候不会带上cookie的，需要通过设置withCredentials: true来解决。且需要后端配合设置

header信息 Access-Control-Allow-Credentials:true

Access-Control-Allow-Origin不可以为 '*'，因为 '*' 会和 Access-Control-Allow-Credentials:true 冲突，需配置指定的地址。

axios全局配置：

axios.defaults.withCredentials = true，

后端的配置，因为后端采用的技术栈不同有不同的配置方式，请根据自身情况自动百度。

前端配置了：withCredentials: true和后端配置了Access-Control-Allow-Origin后大部分情况下跨域是可以携带cookie了，可是最近我遇到了一个比较特殊的情况，这样设置后，在除了chrome外的浏览器都可以正常携带cookie,然后最近可能是chrome升级了，在chrome携带cookie丢失。怎么也带不了cookie。明明是登录成功了，但跳转有新请求发送又跳出来了，这种情况可能就是谷歌浏览器携带cookie失效了，研究了很久找到了解决方案。

参考：https://blog.csdn.net/weixin_39448458/article/details/108323374

解决方法：

一、谷歌浏览器访问 chrome://flags ，搜索SameSite设置为disabled即可！

二、通过后端设置cookie的SameSite属性 SameSite = None

具体设置参考：https://blog.csdn.net/qq_37060233/article/details/86595102

Cookie 的 SameSite 属性

Chrome 51 开始，浏览器的 Cookie 新增加了一个SameSite属性，用来防止 CSRF 攻击和用户追踪。

详细介绍SameSite属性请看阮一峰老师的解释，http://www.ruanyifeng.com/blog/2019/09/cookie-samesite.html