详解 Cookie 新增的 SameParty 属性

╰+攻爆jí腚メ 2022-09-09 11:58 184阅读 0赞

各大主流浏览器正在逐步禁用 `三方Cookie` ，之前笔者也在下面这篇文章中分析了全面禁用 `三方Cookie` 后对我们的网站带来的一些影响：

[当浏览器全面禁用三方 Cookie][Cookie]

但是一个公司或组织往往在不同业务下会有多个不同的域名，例如 `taobao.com`、`tianmao.com`，所以很多正常的业务场景也许要借助 `三方Cookie` 来实现（比如 `单点登录`和 `consent管理`），直接禁用后可能会给我们的业务带来很大影响，而且之前一直以来都没有很好的解决方案，这也是 Chrome 禁用 `三方Cookie` 进展非常缓慢的原因。

![262808dcfd933f5bdae5614f835c380a.png][]

在 `第一方Cookie` 和 `第三方Cookie` 被区别对待的情况下，Chrome 新推出了一个 `First-Party Sets` 策略，它可以允许由同一实体拥有的不同关域名都被视为第一方。

这意味着我们可以标记打算在同一方上下文共享 `Cookie` 的不同域名，目的是在防止第三方跨站点跟踪和仍然保持正常的业务场景下之间找到平衡。

> 目前 `First-Party Sets` 策略还没有正式在稳定版推出，还在试用阶段。

## 一方和三方 Cookie 的区别 ##

可能很多小伙伴对 `三方Cookie` 的概念还比较模糊，我们先来回顾一下：

`Cookie` 本质上不区分第一方或第三方，它取决于包含 `Cookie` 的当前上下文。我们还用之前的老例子：

如果是你正常的正在逛着天猫，天猫会把你的信息写入一些 `Cookie` 到 `.tmall.com` 这个域下，然而打开控制台你会看到，并不是所有 `Cookie` 都是  `.tmall.com` 这个域下的，里面还有很多其他域下的  `Cookie` ，这些所有非当前域下的 `Cookie` 都属于第三方 `Cookie`，虽然你可能从来没访问过这些域，但是他们已经悄悄的通过这些第三方 `Cookie`来标识你的信息，然后把你的个人信息发送过去了。

![395e1621a4a3b6f7cf2ac96928702253.png][]

而 `.tmall.com` 这个域下的 `Cookie` 都属于第一方 `Cookie`，那么为什么还需要第三方 `Cookie` 呢？再打开 `taobao.com`，你会发现你已经不需要再登录了，因为淘宝、天猫都属于阿里旗下的产品，阿里为他们提供统一的登录服务，同时，你的登录信息也会存到这个统一登录服务的域下，所以存到这个域下的 `Cookie` 就成了三方 `Cookie`。

![4194ee06df6180f540165295244eee58.png][]

## SameSite 的问题 ##

`Chrome` 在之前的版本为 `Cookie` 新增了一个 `SameSite` 属性 来限制三方 `Cookie` 的访问，在 `Chrome 80` 版本后 `SameSite` 的默认值被设定为 `SameSite=Lax`。

![05db0ab1f206793c61554adc30571ddf.png][]

在 `Strict` 模式下，将阻止所有三方 Cookie 携带，这种设置基本可以阻止所有 CSRF 攻击，然而，它的友好性太差，即使是普通的 GET 请求它也不允许通过。

在 `Lax` 模式下只会阻止在使用危险 `HTTP` 方法进行请求携带的三方 `Cookie`，例如 `POST` 方式。同时，使用 `JavaScript` 脚本发起的请求也无法携带三方 `Cookie`。

但是，试用上面两种模式，我们上面提到的一些正常的需求场景就无法实现了，对于这种 `Cookie` ，我们现在一般会手动设置 `SameSite=None` 。

这意味着这种 `Cookie` 又失去了跨站点请求伪造 (`CSRF`) 保护，例如在 `evil.site` 发送一个 `me.site` 的请求，也会带上我们的 `Cookie`。

## `First-Party Sets` 策略 ##

在上面正常的业务场景中，所有不同的域名基本上都来自同一个组织或企业，我们希望在同一个运营主体下不同域名的 `Cookie` 也能共享。

`First-Party Sets` 可以定义跨站点上下文仍然是 `first-party` 的情况。 `Cookie` 可以包含在第一方集合中，也可以排除在第三方上下文中。

![5c352d0e5335a17f505750cdef2f6fcf.png][]

`First-Party Sets` 提出了一种明确定义在同一主体下拥有和运营的多个站点关系的方法。比如  `.tmall.com`、`taobao.com` 都可以被定义为同一主体运营 。

> 这个策略来源于浏览器的隐私沙提案中对身份进行分区以防止跨站点跟踪的概念，在站点之间划定界限，限制对可用于识别用户的任何信息的访问。

![1d212bbb098ddede635d64157874a2eb.png][]

浏览器的默认行为是对同一站点进行分区，上面这个新的策略意味着分区被可以开放为多个站点。

![be9033f9086060f3a70ec7c40a094d12.png][]

`First-Party Sets` 策略的一个重要部分是确保跨浏览器的政策防止滥用或误用。例如，`First-Party Sets` 策略不得在不相关的站点之间交换用户信息，或对不属于同一实体的站点进行分组。

所以单点登录这种场景可能是不能用这种方式解决了，因为这个场景属于交换用户信息，目前怎么界定哪些信息是用户信息官方还没有明确的描述，所以这个地方笔者也不是很确定。

> `W3C` 目前正在讨论新的 `First-Party Sets` 的配置和验证，其中一个考虑的选项是由独立实体而非浏览器公司处理验证。

目前 `First-Party Sets` 已经确定的原则如下：

*  `First-Party Sets` 中的域必须由同一组织拥有和运营。
 *  所有域名应该作为一个组被用户识别。
 *  所有域名应该共享一个共同的隐私政策。

## 如何定义 `First-Party Sets` ##

每一个需要用到  `First-Party Sets` 策略的域名都应该把一个 `JSON` 配置托管在 `/.well-known/first-party-set` 路由下。

例如 `conardli.top` 的配置应该托管在 `https://conardli.top/.well-known/first-party-set` 下：

{
      "owner": "conardli.top",
      "version": 1,
      "members": ["conardli.com", "conardli.cn"]
    }

另外 `conardli.com、 conardli.cn` 两个域名均需要增加所有者的配置：

{
      "owner": "conardli.top"
    }

`First-Party Sets` 还有一些限制：

*  一个集合可能只有一个所有者。
 *  一个成员只能属于一个集合，不能重叠或混合。
 *  域名列表不要过大。

## SameParty 属性 ##

好了，上面介绍了一大堆，终于回到本文的主题 `Cookie SameParty` 属性了，这个属性就是为了配合 `First-Party Sets` 使用的。

所有开启了  `First-Party Sets` 域名下需要共享的 `Cookie` 都需要增加 `SameParty` 属性，例如，如果我在 `conardli.top` 下设置了下面的 `Cookie` ：

Set-Cookie: name=lishiqi; Secure; SameSite=Lax; SameParty

这时我在 `conardli.cn` 下发送 `conardli.top` 域名的请求，`Cookie` 也可以被携带了，但是如果我在另外一个网站，例如 `eval.site` 下发送这个请求， `Cookie` 就不会被携带。

![c25c7fb9264032d60a293941f9728dcb.png][]

在 `SameParty` 被广泛支持之前，你可以把它和 `SameSite` 属性一起定义来确保 `Cookie` 的行为降级，另外还有一些额外的要求：

*  SameParty Cookie 必须包含 Secure.
 *  SameParty Cookie 不得包含 SameSite=Strict.

## 如何试用？ ##

在浏览器禁用三方 Cookie 后，这个新的提案应该会被大范围的使用，现在可以先试用起来啦！

你可以在下面两个地方参与提案的讨论：

*  First-Party Sets 策略讨论：https://github.com/privacycg/first-party-sets
 *  SameParty 属性讨论：https://github.com/cfredric/sameparty

现在提案还在试用阶段，你可以试用 `--use-first-party-set` 这个命令启动 `Chrome` ，就可以进行试用啦！

比如，在示例站 `https://fps-member1.glitch.me/` 添加如下配置：

--use-first-party-set=https://fps-member1.glitch.me,https://fps-member2.glitch.me,https://fps-member3.glitch.me

## 参考 ##

*  https://www.chromestatus.com/feature/5280634094223360
 *  https://github.com/cfredric/sameparty
 *  https://developer.chrome.com/blog/first-party-sets-sameparty/

往期推荐

[![c6a0a2d708b618d1d2395ed302220cb4.png][]][c6a0a2d708b618d1d2395ed302220cb4.png 1]

[Vite 太快了，烦死了，是时候该小睡一会了。][c6a0a2d708b618d1d2395ed302220cb4.png 1]

[![faccba6ba9ec8c979136ba09651b4dc7.png][]][faccba6ba9ec8c979136ba09651b4dc7.png 1]

[如何实现比 setTimeout 快 80 倍的定时器？][faccba6ba9ec8c979136ba09651b4dc7.png 1]

[![b04d2aa250d9cb425d9742ed70a2018f.png][]][b04d2aa250d9cb425d9742ed70a2018f.png 1]

[万字长文！总结Vue 性能优化方式及原理][b04d2aa250d9cb425d9742ed70a2018f.png 1]

[![72ccc7ca93f0ab41a3c23ce42e732e53.png][]][72ccc7ca93f0ab41a3c23ce42e732e53.png 1]

[90 行代码的 webpack，你确定不学吗？][72ccc7ca93f0ab41a3c23ce42e732e53.png 1]

如果你觉得这篇内容对你挺有启发，我想邀请你帮我三个小忙：

1.  点个「**在看**」，让更多的人也能看到这篇内容（喜欢不点在看，都是耍流氓 -\_-）
2.  欢迎加我微信「huab119」拉你进技术群，长期交流学习...
    
    关注公众号「**前端劝退师**」，持续为你推送精选好文，也可以加我为好友，随时聊骚。
3.

![80298ca140ec7789b4dce39a21d4ac31.png][]

点个在看支持我吧，转发就更好了

[Cookie]: https://mp.weixin.qq.com/s?__biz=Mzg2NDAzMjE5NQ%3D%3D&chksm=ce6eccfff91945e990e0b21e777f5a85f3f0699f7d51e45a1dd83d0bf36eaf926f7e90fbe3ff&idx=1&lang=zh_CN&mid=2247485523&scene=21&sn=e7f3989448f5ff1e8905fc6596268e33&token=379611469#wechat_redirect
[262808dcfd933f5bdae5614f835c380a.png]: /images/20220829/94ef9220e3134a9bab12563ff16530ec.png
[395e1621a4a3b6f7cf2ac96928702253.png]: /images/20220829/854d30f3655646e0bb5ba1570181ad64.png
[4194ee06df6180f540165295244eee58.png]: /images/20220829/fc60402976ee4afbbafe953560167c81.png
[05db0ab1f206793c61554adc30571ddf.png]: /images/20220829/4a30e93f49c341f9b93567bd2af5a4ef.png
[5c352d0e5335a17f505750cdef2f6fcf.png]: /images/20220829/ceb4c166f2cb49609f3783c27336d043.png
[1d212bbb098ddede635d64157874a2eb.png]: /images/20220829/91759f55450e4847a6721eb5433aa12b.png
[be9033f9086060f3a70ec7c40a094d12.png]: /images/20220829/cb49fc7fb53645a6aeee9ca0d5b36a2d.png
[c25c7fb9264032d60a293941f9728dcb.png]: /images/20220829/0f75fb33174c4e54b6a5d68212dc67ba.png
[c6a0a2d708b618d1d2395ed302220cb4.png]: /images/20220829/da7aedb1310d4f95be199df052a09bde.png
[c6a0a2d708b618d1d2395ed302220cb4.png 1]: http://mp.weixin.qq.com/s?__biz=MzI1NDU3NzM5Mg%3D%3D&chksm=e9c24fb1deb5c6a70410889666afec7da71e77e5ab4b17b7677a22a554fdc9ee2f3d97006322&idx=1&mid=2247487534&scene=21&sn=947df5483ab7508f8d2f9abd8c2f11a8#wechat_redirect
[faccba6ba9ec8c979136ba09651b4dc7.png]: /images/20220829/ca9027aa75a34920948f931495f15ad7.png
[faccba6ba9ec8c979136ba09651b4dc7.png 1]: http://mp.weixin.qq.com/s?__biz=MzI1NDU3NzM5Mg%3D%3D&chksm=e9c25151deb5d847686e17e267e9659124dd4250f9df681564ce87a55190625bfd49adc02661&idx=1&mid=2247487182&scene=21&sn=ae83a65d4e6a9ee8b3b98a4cbe20c96b#wechat_redirect
[b04d2aa250d9cb425d9742ed70a2018f.png]: /images/20220829/5923b8607ca9423e8f685eb640ce1576.png
[b04d2aa250d9cb425d9742ed70a2018f.png 1]: http://mp.weixin.qq.com/s?__biz=MzI1NDU3NzM5Mg%3D%3D&chksm=e9c251e2deb5d8f455c581ddaf84a503c912d4bc2def725105fdf7442af6df6c6af0dee01b7b&idx=1&mid=2247487101&scene=21&sn=92c60dd47cf94731829bf006cd2b5e36#wechat_redirect
[72ccc7ca93f0ab41a3c23ce42e732e53.png]: /images/20220829/28aca7ba51bb4287bf0c98528e62d843.png
[72ccc7ca93f0ab41a3c23ce42e732e53.png 1]: http://mp.weixin.qq.com/s?__biz=MzI1NDU3NzM5Mg%3D%3D&chksm=e9c24f0adeb5c61c4c64564fa3ef07fae165e0ba9c115c5846db1a94cd97f5f101e764c9b604&idx=1&mid=2247487637&scene=21&sn=bb353093eee2f07cfcfc7e4ad460ce7f#wechat_redirect
[80298ca140ec7789b4dce39a21d4ac31.png]: /images/20220829/a96045e1c311409dbb701dfd640bc721.png