解决chrome浏览器请求无法携带Cookie问题
遇到的问题
最近在本地(localhost)开发项目的时候,遇到明明登陆了,但是接口一直返回未登陆,一查发现接口没有携带 cookie。
究其原因发现
Chrome 在 51 版本时为 cookie 增加了SameSite
属性,用于防止跨域携带 Cookie 引发的用户行为跟踪和 CSRF 攻击,80 版本以下 SameSite 属性默认为 none,跨域请求能够携带 cookie。Chrome 升级到 80 版本之后 cookie 的 SameSite 属性默认值由 None 变为 Lax,造成了一些访问跨域 cookie 无法携带的问题!
那 SameSite 又是什么呢?
是浏览器的 Cookie 用来防止 CSRF 攻击和用户追踪而新增的一个属性。
SameSite 的值有三种:
1、Strict 最严格,完全禁止第三方 cookie。只要跨站点就会丢 cookie。用户体验非常不好。
Set-Cookie: CookieName=CookieValue; SameSite=Strict;
2、Lax chrome>80 Lax 是默认值) 稍微严格,大多数的情况下也是禁止第三方 cookie。但是导航到目标网址的 GET 请求除外。
Set-Cookie: CookieName=CookieValue; SameSite=Lax;
3、None(chrome<80 None 是默认值) chrome>80 的话 因为 lax 是默认值,只允许第三方 get 情况可以携带 cookie,如果是 post 跨域请求的话就会导致 cookie 丢失问题,需要手动的将 SameSite 设置为 None(前提是必须同时设置 Secure 属性(Cookie 只能通过 HTTPS 协议发送));
无效代码:
Set-Cookie: widget_session=abc123; SameSite=None
有效代码:
Set-Cookie: widget_session=abc123; SameSite=None; Secure
根据上述,我们不难发现只要将 SameSite 属性设置成 None,就可以解决我们遇到的问题。
具体的解决方案如下:
1、通过改变浏览器的设置
MAC:
1.1 第一种方式:手动打开 chrome
chrome://settings/safetyCheck
chrome://flags/
if version < 91
设置如下:
else if version >= 91
设置如下:
Relaunch chrome(重启 chrome)
1.2 第二种方式:命令行携带 cookie 方式打开 chrome
注:需要关闭所有的浏览器窗口并退出 chrome 后操作
open -a "Google Chrome" --args --disable-features=SameSiteByDefaultCookies
open -a "Microsoft Edge" --args --disable-features=SameSiteByDefaultCookies
注:Mac 系统下通过执行命令运行浏览器如果依旧无法解决可尝试重启浏览器后再执行命令打开浏览器,该命令需要保证完全关闭并退出浏览器再执行才能生效。
else if version >= 94
The flags #same-site-by-default-cookies and #cookies-without-same-site-must-be-secure have been removed from chrome://flags as of Chrome 91, as the behavior is now enabled by default. In Chrome 94, the command-line flag --disable-features=SameSiteByDefaultCookies,CookiesWithoutSameSiteMustBeSecure will be removed.
94 以后 通过命令行禁用设置 SameSite 默认值的方式会被移除,1.1 方式一和 1.2 方式二都会失效,这时候 只能通过 3 的 Nginx 代理或软件将跨域请求转为非跨域请求来解决。
windows
打开 Chrome 快捷方式的属性,在目标后添加–disable-features=SameSiteByDefaultCookies,点击确定,关闭所有 Chrome 窗口包括 Chrome 浏览器后再重启浏览器运行项目即可解决。
windows
2、通过设置后端响应头
Set-Cookie: widget_session=abc123; SameSite=None; Secure
3、通过改变 Nginx 的 location 配置
proxy_cookie_path / "/; httponly; secure; SameSite=None";
4、可以直接换成 火狐等其他非 chrome 浏览器进行本地开发
码云笔记 » 解决chrome浏览器请求无法携带Cookie问题