Chrome 80跨域cookie无法携带

什么是cookie

HTTP是无状态协议，也就是说服务器完全不清楚是否是同一位用户在访问。在最开始HTTP协议只是做为共享文本内容而存在是可行的，但是随着Web发展，Web内容的丰富化，必须需要有一种技术去记录HTTP协议的用户状态，而cookie技术就是充当这个角色的。

简言之，cookie就是存储在浏览器下的文本文件，用于记录用户状态信息。用户在第一次向服务器发送访问请求时，浏览器发起请求，服务端返回相应通过首部set-cookie字段向浏览器写入cookie信息，在cookie有限期内，浏览器再次向服务器发起访问请求时，会带上cookie信息，从而服务器能识别当前用户身份以及保存的状态信息等内容。

如下是google主页log接口携带的cookie信息。

cookie的属性

cookie属性主要包含Name、Value、Domain、Path、Expires/Max-Age、HttpOnly、Secure、SameSite。

• Name：cookie的名称，同域名下cookie名称应该是唯一的，如果同域名下存在同名的cookie会被覆盖；
• Value：cookie的具体值，一般建议cookie值进行编码；
• Domain：cookie绑定的域名，如果不指定默认绑定到当前域名，也可以通过设置Domian属性实现跨域，就是通过将cookie绑定在一级域名下，从而实现二级域名访问跨域；
• Path：cookie绑定的访问路径，一般都是默认绑定在跟路径下即/；
• Expires/Max-Age：cookie的有效期，一般cookie都是有有效时效的，时效范围内cookie是可用，过时效以后即失效；
• HttpOnly：cookie是否可以通过JavaScript进行操作，如果设置HttpOnly属性为true客服端将无法操作该cookie信息；
• Secure：HTTP不仅无状态且是不安全的协议，内容是以明文的方式传递的，而Secure这个属性就是标示cookie是不是仅在https、ssl等安全协议下使用，设置secure为true时及仅安全协议使用；
• SameSite：用来限制第三方cookie的属性，避免风险，主要包括三个值strict（最为严格，完全禁止第三方cookie，跨站点时，任何情况下都不会发送cookie。换言之，只有当前网页的URL与请求目标一致，才会带上cookie）、Lax（稍稍放宽，大多数情况也是不发送第三方cookie）、none（显式关闭SameSite属性，必须同时设置Secure属性（cookie只能通过HTTPS协议发送），否则无效），目前Chrome 80已经将该属性默认设置为Lax规则（详情参看：Cookies default to SameSite=Lax）。

Chrome 80的SameSite

A cookie associated with a cross-site resource at https://accounts.google.com/ was set without the SameSite attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with SameSite=None and Secure. You can review cookies in developer tools under Application>Storage>Cookies and see more details at https://www.chromestatus.com/feature/5088147346030592 and https://www.chromestatus.com/feature/5633521622188032

Chrome升级到80版本之后cookie的SameSite属性默认值由None变为Lax，这也就造成了一些访问跨域cookie无法携带的问题。比如本地调试时使用http://localhost:3000/，而cookie是种在测试环境路径下这就造成本地调试跨域访问不通了。可以考虑在本地开发环境下disable该SameSite属性。在Chrome中访问chrome://flags/，搜索SameSite并设置为disabled即可。