前后端分离的项目中(跨域请求 api), 如何正确使用 cookie 作为验证?

[FaiChou]

问题相关: fetch api 在浏览器内无法保存和发送 cookie

昨天碰到浏览器无法发送 cookie 的问题, 最后才发现是浏览器默认禁止第三方 cookie.

Chrome / Safari / iOS Safari 都是默认禁止三方 cookie 的.

好久之前做项目都是用 token 作为验证方式, 现在这个小项目后端使用 php5.6 seesion 形式记录用户会话.

那么问题来了, 现在浏览器禁止了三方 cookie 还有用 cookie 作为验证的可能吗? 不可能引导用户去手动开启 cookie 权限吧?

有啥好的替代方案? auth2?

ps. 小项目是 react 写的界面, 放到微信里的页面.

[lhx2008]

不过你可以研究下我网站上面那个 mta.qq.com 的请求，即使关闭了第三方 cookies，照样可以保持跟踪

[wu67]

额, 所以在 api 后面加?token=***不行吗

[wuhuaji]

@lhx2008 没明白你说的 domain 跨域完全不能用什么意思？ cookie 是要设置 domain 的。

如前面有人所说，Provisional headers are shown 是 Chrome 的特色问题，不可尽信。你可用 Firefox 或者 Safire 看下。这里我看到响应头，是从请求中复制请求 [右键-copy-copy as curl ] ，然后拿到命令行中请求的。

[FaiChou]

@wuhuaji 好的 谢谢 我也试过 可以拿到

[lhx2008]

是 pingjs.qq.com 那个，很神奇，不知道有没大佬破解一下，关 cookies 重启浏览器依然可以保持不变

[lhx2008]

js 在 pingjsqq.com
然后，核心代码是
a = "pvi";
window.localStorage ? localStorage.getItem(a) || sessionStorage.getItem(a) : (a = document.cookie.match(new RegExp("(?:^|;\\s)" + a + "=(.*?)(?:;\\s|$)"))) ? a[1] : "";
先获取当前域下面的 localStorage，如果没有，获取 pingjsqq.com 域下面的 cookies 里面的 id，然后 set 到当前域的 localstorage，下次再读取当前域的 localstorage

[pubby]

请求时发送 cookie 是没问题的。

只是无法保存跨域 api 发来的 cookie

所以如果 api 域名是 abc.com 的话，你得想办法先跳转到 abc.com 去接收 cookie

[FaiChou]

@lhx2008 是的 在 local storage 里是有个 pgv_pvi 字段.

[FaiChou]

@pubby 是的, 这也是个解决方案, 但如果自己写的话内容有点多, 在这个小项目中不值得.

[lhx2008]

@FaiChou 他妙在用 js 域的 cookies 来存 token，兼容了浏览器不支持 localstorage 的情况，而且实现了跨域名追踪

[pubby]

@FaiChou 和项目大小无关，用 cookie 只能这么搞

[lhx2008]

我在 Github 上面看到一个更骚的操作，挂载一个 iframe，然后用 HTML5 的 postMessage 进行跨域通信

[lhx2008]

https://github.com/contently/xdomain-cookies

[FaiChou]

@pubby @lhx2008

谢谢.

在 SO 上看到过一个~~答案~~问题 https://stackoverflow.com/questions/3342140/cross-domain-cookies

[lhx2008]

我总结了一下，发了个帖子
https://www.v2ex.com/t/520756

[EvilCult]

jwt 了解一下
header 里加 Authorization