深入浅出Cookie -SameSite，冲冲冲

最新推荐文章于 2024-08-21 09:45:09 发布

谭婧杰

最新推荐文章于 2024-08-21 09:45:09 发布

阅读量1.6k

点赞数

分类专栏：前端文章标签： cookie

本文链接：https://blog.csdn.net/qq_42236003/article/details/105103799

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTTP

一说到http（http1.x），我们想到的第一个词语，可能就是无状态协议了，但是什么是无状态协议，维基百科是这样解释的：无状态协议是指把每一种请求都是做为与之前请求都无关的独立的事务的服务器
简单粗暴的理解就是同一个客户端连续发送两次请求给服务器，服务器也识别不出来这是同一个人发送的请求，这就导致了一个问题就是你不能刷新页面，这样一来，那还搞个鬼，好不容易可以上一下网，还不敢刷新页面，简直就是六亲不认，无情啊，所以为了让浏览器更加有人情味，Cookie站出来了

Cookie

cookie就是为了解决http无状态的问题的，但是这样说好像也不好，无状态并不是不好，微服务应用的“12要素”原则里面就明确说了应用是以一个或多个无状态进程运行应用，12-Factor 应用的进程必须无状态且无共享。任何需要持久化的数据都要存储在后端服务内，比如数据库,但是老子说的万物都相对立的，古人诚我不欺，所以说无状态并不是不好，但是它也会导致一些问题，cookie的存在不仅仅是为了解决通讯协议无状态的问题，也是为了解决客户端与服务端会话状态（后端服务状态）的问题

Cookie简单介绍

首先还是搞出专业的数据来，引用维基百科

Cookie（复数形态Cookies），类型为「小型文本文件」，指某些网站为了辨别用户身份而储存在用户本地终端上的数据。

做为一段不超过4KB的小型文本数据,它由一个名称，一个值和其他几个属性组成，我下面会一一介绍：
首先我们查看一下cookie,看一下这个鬼到底在哪里，毕竟知己知彼，才能百战不殆是吧，谷歌F12打开开发者模式
在这里插入图片描述虽然我们可以在浏览器可以看见它，不过其实它还是可以放在本地的，这样的好处是你就算关闭了浏览器，cookie还是有用的

属性

Name/Value
望文生义，就是名称和值了，不过js操作cookies的时候注意要编码

Expires
过期时间

当 Expires 属性缺省时，表示是会话性 Cookie，Expires 的值为 Session，表示的就是会话性
Cookie。当为会话性 Cookie
的时候，值保存在客户端内存中，并在用户关闭浏览器时失效。需要注意的是，有些浏览器提供了会话恢复功能，这种情况下即使关闭了浏览器，会话期
Cookie 也会被保留下来，就好像浏览器从来没有关闭一样。

Max-Age
Cookies失效之前的秒数
Max-Age 可以为正数、负数、甚至是 0。

如果 max-Age 属性为正数时，浏览器会将其持久化，即写到对应的 Cookie 文件中。

当 max-Age 属性为负数，则表示该 Cookie 只是一个会话性 Cookie。

当 max-Age 为 0 时，则会立即删除这个 Cookie。
假如 Expires 和 Max-Age 都存在，Max-Age 优先级更高。
Domain
Cookies可以送达的主机

Path
指定了一个Url路径，这个路径必须出现在要请求的资源的路径中才可以发送 Cookie 首部。比如设置 Path=/tanjingjie，/tanjingjie/index/ 下的资源会带 Cookie 首部，/test 则不会携带 Cookie 首部

Source
标记为 Secure 的 Cookie 只应通过被HTTPS协议加密过的请求发送给服务端。使用 HTTPS 安全协议，可以保护 Cookie 在浏览器和 Web 服务器间的传输过程中不被窃取和篡改

HTTPOnly
设置 HTTPOnly 属性可以防止客户端脚本通过 document.cookie 等方式访问 Cookie，有助于避免 XSS 攻击。

SameSite
${}SameSite 是最近非常值得一提的内容，因为 2 月份发布的 Chrome80 版本中默认屏蔽了第三方的 Cookie$

我们详细看一下SameSite

SameSite 可以有下面三种值：

Strict 仅允许一方请求携带 Cookie，即浏览器将只发送相同站点请求的 Cookie，即当前网页 URL 与请求目标 URL完全一致。
Lax 允许部分第三方请求携带 Cookie
None 无论是否跨站都会发送 Cookie

之前默认是 None 的，Chrome80 后默认是 Lax

跨域和跨站
首先要理解的一点就是跨站和跨域是不同的。同站(same-site)/跨站(cross-site)」和第一方(first-party)/第三方(third-party)是等价的。但是与浏览器同源策略（SOP）中的「同源(same-origin)/跨域(cross-origin)」是完全不同的概念

同源策略的同源是指两个 URL 的协议/主机名/端口一致。例如，www.taobao.com/pages/…，它的协议是 https，主机名是 www.taobao.com，端口是 443。

「同站」判断比较宽松：只要两个 URL 的 eTLD+1(有效顶级域名+二级域名) 相同即可，不需要考虑协议和端口。