请教前端大佬一个跨域保存 cookie 问题

[engongong]

a 网站页面 iframe 嵌入 b 网站页面， b 网站项目需要保存请求 b 网站项目自己的 cookie ， a b 是不同主域名， 在 iframe 中如何才能保存 b 的 cookie

[lcy630409]

我记得 浏览器会自己保存域名下的 cookie 啊？难道不是么 怀疑自己...

[engongong]

@lcy630409 #1
a b 是不同主域名，保存不了

[kuoruan]

SameSite=None; Secure; HttpOnly

[shintendo]

“b 网站项目需要保存请求 b 网站项目自己的 cookie”

没看懂这跟 a 有啥关系

[SanjinGG]

看几遍也没看到是什么问题，a 是 iframe 还是 b 是 iframe ？目前看 a,b 并不需要对方的 cookie ，各自保存到 cookie 就是了

[alvinbone88]

如果不考虑登录状态同步的话，可以看看这个
https://developer.mozilla.org/en-US/docs/Web/Privacy/Guides/Privacy_sandbox/Partitioned_cookies

[engongong]

@SanjinGG #5
a 里嵌入了个 iframe ，打开是 b 网站。a b 是不同主域名，保存不了 b

[rabbbit]

3 楼那个解决办法有用吗？

[gausszhou]

3 楼已经解答了

[n18255447846]

你的问题得分两部分
1. 浏览器默认就会保存不同域名下的数据，包括 cookie 等，这不需要额外的操作，在 devtools 里能看到
2. 你的问题因该是 iframe 里 b 域名的网站请求未携带 cookie 的问题

[feixiangcode]

如果是两个完全不一样的一级域名，我理解保存不了。

[xinkuie]

三方 cookie 问题，可以试下 SameSite=None; Secure ，但不能完全解决，还取决于浏览器种类/版本/设置

[agcl02]

1.在主页面 A 中使用 postMessage 向 iframe 发送数据
2.在 iframe 页面 B 中监听消息，并设置 cookie

[journalistFromHK]

iframe 一般是别人的 怎么设置啊…

[sampeng]

别人的？你要是可以那不叫跨域，那叫偷 cookie😂

[DOLLOR]

想保存哪个域名的 cookie ，就由那个域名的网站来保存。
比如 b 网站的响应报头，或者 b 网站的 JS 上下文。
如果 b 不是你家的，那你得叫 b 的程序员给你改，外面的 a 是什么也干不了的。

[qiuxuqin]

这个问题我也遇到过，3 楼说的 SameSite=None; Secure; HttpsOnly （原楼主的 https 打欠了个 s ）是可以解决，但是这要求页面是 https 协议的，而我开发的页面（也就是楼主说的被嵌入的页面 b ）是 http 的，这样的页面没法解决 cookie 不能跨域的问题。
我的解决方案是，b 页面不用 cookie ，直接把 token 保存在 URL 中，每次请求接口时都把 URL 携带的 token 传给接口（通过 HTTP 请求头）。

[qiuxuqin]

这个问题我也遇到过，3 楼说的 SameSite=None; Secure; HttpsOnly （原层主的 https 打欠了个 s ）是可以解决，但是这要求页面是 https 协议的，而我开发的页面（也就是楼主说的被嵌入的页面 b ）是 http 的，这样的页面没法解决 cookie 不能跨域的问题。
我的解决方案是，b 页面不用 cookie ，直接把 token 保存在 URL 中，每次请求接口时都把 URL 携带的 token 传给接口（通过 HTTP 请求头）。

[ymcz852]

我测试了下，
- same site：main page 和 iframe page 主域名相同，子域名不同
- cross site：main page 和 iframe page 主域名不同


### 测试结果总结

| **测试类型** | **Chrome** | **Firefox** | **Safari** |
| --- | --- | --- | --- |
| Same Site 测试 | 正常/无痕模式均携带 Cookie | 正常/无痕模式均携带 Cookie | 正常/无痕模式均携带 Cookie |
| Cross Site (SameSite: Lax) | 正常: ❌ 无痕: ❌ | 正常: ✅ 无痕: ✅ | 正常: ❌ 无痕: ❌ |
| Cross Site (SameSite: None) | 正常: ✅ 无痕: ❌ | 正常: ✅ 无痕: ✅ | 正常: ❌ 无痕: ❌ |

通过测试可以看出：

- 同站(Same Site)情况下：所有浏览器在正常和无痕模式下均正常处理 Cookie
- 跨站(Cross Site)情况下：
- Chrome: 只在正常模式下接受 SameSite=None 的 Cookie
- Firefox: 最为宽松，全部接受
- Safari: 最为严格，全部拒绝

[skallz]

这个类似场景之前设计过方案，a 、b 网页是不同的主域名，要求 a 登录过后，打开 b 网页也要保持登录状态，也就是共享 token ，方案是 a 登录过后尝试与同 ip 下同指纹的页面通过 webrtc 建立连接，当 b 网页打开后，由于浏览器指纹相同，此时 a 与 b 建立连接，a 将 token 传给 b ，b 接收之后完成自动登录，同时打开 a 与 b 域名的网页并且同 ip 同浏览器指纹的用户几乎不会撞见相同的（该应用是 b 端，用的人不会很多）

[skallz]

@skallz 这个场景比 op 的还要严格，因为是不同窗口，iframe 的话直接 postmessage 或者用 url 传参就可以了

[engongong]

谢谢各位回复！
token 是 b 网页项目生成的，不太可能 postmessage 或者用 url 传参
后面按 3 楼试试