为什么Cookie不能跨域访问? token怎么实现跨域访问?

CPALyth
  • 57

网上的博客都说cookie不能实现跨域访问,
但是我研究了CORS发现: 服务端响应头传回了Access-Control-Allow-Credentials: true, 则可以跨域传递cookie, 这要怎么解释 cookie不能跨域访问?

token既可以存放在Local Storage中, 也可以存放在cookie中, 那如果存放在cookie中, token是怎么实现跨域的呢?

回复
阅读 1.5k
2 个回答

不想多写,毕竟能参考的文档很多,个个都比我复制粘贴一遍好。

我就看文档瞎写下。


首先什么叫跨域,谁控制跨域。

浏览器处理跨域问题。如果当前访问站点 a.com,a.com上的脚本 a.js 尝试请求 api.b.com ,则出现跨域。跨的是域名(domain)。

跨域请求按是不是简单请求分为两种情况。

非简单请求:

  1. 预检请求(pre-flight),询问指定站点的跨域策略
  2. 正式请求

简单请求则跳过预检。

预检中,服务器告诉浏览器自己的跨域策略:允许什么域名访问,允许以什么方法请求,是否允许附带身份验证等...


那么 cookies 能跨域吗?

答案可能比较奇怪,能。对于简单请求,浏览器不会预检,只要在 xhr 设置标志位 withCredentials,就能附带 cookies 发出 xhr 请求。

当附带 cookies 的 xhr 发出后,服务端可以用 Access-Control-Allow-Credentials 来控制浏览器要不要把响应体返回给 js 。如果没有设置 Access-Control-Allow-Credentials 则浏览器不会吧响应返回给发送者。

要让 cookies 跨域还有个要求就是 Access-Control-Allow-Origin 不能是 *,这也要求了服务器必须显式指定允许的跨域来源。


那 token 怎么实现的跨域呢?

首先还是要跨的目标要允许你跨。设置 Access-Control-Allow-Origin。如果 token 放在 HTTP Header 里则可能导致产生一个预检请求,如果放在 Cookies 里则可能不会产生预检。但最终都是要受到跨域策略限制的。


参考:

跨域资源共享(CORS) - MDN

你有两个站点,a.com,b.com,都设置了允许跨域访问
你现在要在a.com请求b.com的接口,
a.com请求的时候带的是a.com的cookie
b.com返回的时候cookie也是设置到b.com的。
正常情况你在a.com是获取不到b.com的cookie。
如果非要获取,可以设置同源策略,嵌套b.com脚本然后postmessage的方式获取,但是这种方式很极端只适用少部分情况。
正常的实现还是,前端请求api,api返回token,前端你可以存到cookie或者localStorage,请求api的时候手动获取token,追加到请求头中(可以是cookie,也可以是其他header头)即可。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏