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