如何通过express应用程序发送的标头在浏览器中设置cookie

Question

app.js

const express = require("express")
const cors = require("cors")
const bodyParser = require("body-parser");

const app = express();
app.use(express.json())
app.use(cors())



app.post('/getcookies', (req, res)=>{

    res.cookie('test', 'jwt', {expiresIn : "2h", httpOnly : false, secure : false, strict : "none"}).status(200).json({how : "done"});
})

app.listen(7000, ()=>{
    console.log("success...");
})

在此输入图片描述

我已经向邮递员发出了请求，但它没有显示任何 set-cookie 标头，因此没有设置 cookie。 如果我更改获取并访问 http://localhost:7000/getcookies 的方法，则 cookie 会在浏览器中设置。 如果我通过单击按钮从 http://localhost:3000/ 到 http://localhost:7000/getcookies 发出发布请求，那么 cookie 也不会在浏览器中设置。但在网络选项卡中显示了 set-cookie 标头。 请任何人帮助我在浏览器中设置从 Express 到 React 应用程序的 Cookie，只需单击发布并获取请求的按钮即可。

注意：我正在使用 axios 向 React 发出请求

Answer 1

如果您使用 fetch，则需要设置选项

credentials

来包含。以下是一个例子：

try {
  const res = await fetch("http://localhost:7000/getcookies", {
    method: "POST",
    credentials: "include",
  });

  const json = await res.json();
  console.log(json);
  // Don't worry, cookies are set :)
} catch (err) {
  console.log(err);
}

使用 axios，同样的事情，但选项称为

withCredentials

try {
  const res = await axios.post("http://localhost:7000/getcookies", { withCredentials: true });

  // Don't worry, cookies are set :)
} catch (err) {
  console.log(err);
}

如果您没有使用这两个 HTTP 客户端中的任何一个，请尝试查看是否有类似的选项可以通过。希望这有帮助！