CORS 跨域携带 Cookie 发送请求

问题

当在 a.com 进行访问时，如何向 b.com 携带 b.com 的 cookie 发送一个请求？

情境

a.com 是一个第三方网站，需要通过访问 b.com 的接口来获取用户的一些信息。这时候，b.com 上的用户已经登录了。

跨域请求

我们知道，在发送跨域请求时，需要后端设置一些请求头，否则浏览器不会允许客户端跨域发送请求。

Access-Control-Allow-Origin: a.com

这样，a.com 便可以调用 b.com 的接口了。

但是，这样调用过去会发现，b.com 会返回用户未登录。原因是 b.com 的 cookie 没有发送过去。

跨域携带 Cookie

这时候需要后端添加另外一个请求头：

Access-Control-Allow-Credentials: true

前端在发送请求时也需要设置

xhr = new XMLHttpRequest();
xhr.withCredentials= true;  //关键句
xhr.open("GET", url);
xhr.send();

这样，后端就可以接收到前端携带的 Cookie 了。

总结

综上所述，前端需要在发送 XMLHttpRequest 的时候加上

xhr.withCredentials= true;

后端需要设置请求头（表示你信任 a.com 并允许 a.com 带上你的凭据）:

Access-Control-Allow-Origin: a.com //这里需要换成相应的发起请求的域名
Access-Control-Allow-Credentials: true