cookie無法自動攜帶問題排查

以前公司的專案，曾經遇到過cookie無法攜帶的問題，排查了很久。近日乙個做前端的朋友也遇到了類似的問題，問起我來，想想這個問題也可以記錄一下，於是便有了這篇文章。

首先，同域請求時，cookie是可以自動攜帶的，出現cookie無法自動攜帶，往往就是跨域導致的。

一般現在都是前後端分離，因此一般都會有跨域的情況，往往cookie無法自動攜帶就是跨域問題導致的。

我認為遇到類似的問題(cookie無法自動攜帶)需要注意以下幾點：

是否設定了withcredentials

如果在傳送來自其他域的xmlhttprequest請求之前，未設定withcredentials 為true，那麼就不能為它自己的域設定cookie值

由於我最熟悉的是vue，用的最多的庫是axios，因此特別拿出來先說：

// axios

// 一般而言，我們使用axios時都會封裝乙個專案的請求庫（當然使用jq等也是一樣，這裡只是以axios舉例），那寫法應該是類似如下：
;// 當然單獨使用也是可以的，寫法類似如下：
cons data =
axios.
post
('url'
,data,
);

// 原生ajax

)

確認後台的配置是否正確，這個可以通過檢視請求的響應報文來判斷。

如果是跨域請求，後端的請求是要配置cors的。這塊後端具體要怎麼寫**，我是不熟悉的，但是這並不影響我們進行判斷。

首先請確認跨域請求是否正常，預檢是否返回200。檢視報文，複雜請求，在請求前還有乙個options請求，看看他是否返回了200，如果沒有就證明它的配置存在問題。

大體上後端涉及配置請求頭如下：

access-control-allow-origin: | * // 授權的訪問源

access-control-max-age: // 預檢授權的有效期，單位：秒
access-control-allow-credentials: true | false // 是否允許攜帶 cookie
access-control-allow-methods: [, ]* // 允許的請求動詞
access-control-allow-headers: [, ]* // 額外允許攜帶的請求頭
access-control-expose-headers: [, ]* // 額外允許訪問的響應頭

附帶身份憑證的請求與萬用字元

對於附帶身份憑證的請求，伺服器不得設定 access-control-allow-origin 的值為「」。

這是因為請求的首部中攜帶了 cookie 資訊，如果 access-control-allow-origin 的值為「」，請求將會失敗。而將 access-control-allow-origin 的值設定為 則請求將成功執行。

補充一句提問話：當時我遇到的cookie無法攜帶的問題，其中乙個原因就是後台配置access-control-allow-credentials時錯誤配置了兩個true。。。

所以，請一定要仔細比對報文，看清楚是否有異常的地方

會不會，走完了以上的流程還是無法解決問題呢？我無法排除這種可能。

我相信，仔細檢查完以上兩步是可以解決絕大部分cookie無法自動攜帶問題的（請確保你自身已經仔細的排除了以上兩點原因），但凡事總有意外。

最近我吸取了乙個教訓，要用經驗解決問題也許可以提高效率，但有時反而會蒙蔽了自己的眼睛，而對真相視而不見。也許問題的原因是你自身萬萬沒想到的。我的建議是遇到這種請求，請審視一下，自身是否有什麼假設，而將真相排除在外了，這一點很重要，尤其是你已經束手無策的時候！

例如，會不會真的是瀏覽器的問題，會不會這個版本存在缺陷等。我知道一般這種概率比較低，但真的請不要輕易將低概率事件和不可能發生等同起來。考慮重啟電腦，更換裝置的方法。

以上是我的建議，不過，關於cookie無法攜帶，我還是可以想到一些其他的可能的，也許你可以再依據這些去排查一下：

好，以上就是我對cookie無法自動攜帶問題的整理，希望能幫助到你

axios請求無法攜帶cookie

背景 最近在用vue重構公司公司angularjs 1.x專案，老專案身份認證採用的cookie，前端ajax庫採用是angularjs的 http resource服務，新版採用的是axios，但是發現前端http響應頭中少了set cookie屬性，同時在瀏覽器中查詢不到cookie資訊,服務端...

請求不攜帶cookie問題

因為後端需要用到cookie做一些判斷，所以在post請求前先寫入了cookie。在頁面未登入時，調介面能帶上cookie，登入後的請求沒有攜帶cookie，但是能看到cookie已經儲存了。axios.defaults.withcredentials true 配置了並沒有用 對比登入前後，發現是...

解決axios請求cookie無法攜帶問題

js cookie 可以訪問這個鏈結 然後在元件內引入 import cookies from js cookies 然後通過set來設定我們的cookie cookies.set name value 然後通過get來獲取我們的cookie cookies.get name value 這時我們訪...