我有一個 Express 服務器，我在上面生成 csrf 令牌。我的服務器看起來像這樣
const csrfProtection = csrf({
cookie: {
httpOnly: true,
},
});
server.use(express.json());
server.use(express.urlencoded({ extended: true }));
server.use(
cors({
origin: "http://localhost:3000",
credentials: true,
})
);
server.use(cookieParser());
server.use(csrfProtection);
...
//Other routes
我像這樣發送令牌
export const csrf = (req, res) => {
return res.send({ csrfToken: req.csrfToken() });
};
如果我從回應中獲取它并將其添加到X-CSRF-TokenPostman的標頭中，那么我可以很好地訪問所有路由。但是當我在 React 中這樣做時，我總是收到invalid csrf token錯誤
這就是我在 React 中獲取令牌的方式
export const getCSRFToken = async () => {
try {
const { data } = await axios.get("/auth/csrf");
axios.defaults.headers.post["X-CSRF-Token"] = data.csrfToken;
} catch (error) {}
};
我正在withCredentials: true其他請求中使用該標志。我無法弄清楚我錯過了什么。
uj5u.com熱心網友回復：
也許你應該axios.defaults.headers.post["X-CSRF-Token"] = data.csrfToken改為axios.defaults.headers.common["X-CSRF-Token"] = data.csrfToken
uj5u.com熱心網友回復：
顯然，問題是您也需要將 withCredetials 標志傳遞給獲取 csrf 令牌的請求。所以這解決了問題。
export const getCSRFToken = async () => {
try {
const { data } = await axios.get("/auth/csrf", { withCredentials: true });
axios.defaults.headers.common["X-CSRF-Token"] = data.csrfToken;
} catch (error) {}
};
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/328771.html