javascript - 表示没有设置Cookie

Question

我有 2 个服务器。一个在 localhost:5555 上托管 next.js 应用程序，另一个在 localhost:4444 上托管 api 的快速服务器。

身份验证 api 返回一个 cookie，但是在 localhost:5555 上运行的浏览器中未设置此 cookie。

  res.cookie('cokkieName', 'bob', {
        domain: '127.0.0.1:5555',
        maxAge: 900000,
        httpOnly: true,
    });

    res.status(200).json({
        session: jwtSigned,
        role: 'default',
    });

我的 cors 设置是:

const options: cors.CorsOptions = {
    allowedHeaders: ['Origin', 'X-Requested-With', 'Content-Type', 'Accept', 'X-Access-Token', 'Authorization'],
    credentials: true,
    methods: 'GET,HEAD,OPTIONS,PUT,PATCH,POST,DELETE',
    origin: 'http://localhost:5555',
    preflightContinue: false,
};

我更愿意使用 api 设置 cookie，而不是通过 next.js。

我试过交替使用 cors 设置，但没有成功。客户端调用使用 axios 并设置了 withCredentials。

Answer 1

如另一个答案中所述，您不能在不同的域上设置 cookie，因为这可能存在安全风险。

但是从你的问题...

由于 API 服务器正在运行身份验证逻辑，因此应在 API 服务器域而不是客户端域上设置 cookie

因此在您的 API 服务器中，您可以将代码更改为

res.cookie('cokkieName', 'bob', {
        domain: '127.0.0.1:4444',
        maxAge: 900000,
        httpOnly: true,
    });

或者只是删除域，因为它默认为服务器域。

res.cookie('cokkieName', 'bob', {
            maxAge: 900000,
            httpOnly: true,
 });

因为你有一个运行在 localhost:5555 上的客户端和运行在 localhost:4444 上的 API 服务器，这是一个跨域调用，你需要将 withCredentials 选项传递给 axios传递cookie。您可能无法在浏览器中看到 cookie，因为它可能存在安全风险，但可以在服务器控制台上回显 cookie 值。

axios.get("url",{
    withCredentials: true
    }).then(res => {
            console.log(res);
    });

请注意，仅当 Access-Control-Allow-Origin header 不是 * 等通配符时，凭据选项才有效

我创建了一个 server模仿您发布的代码。服务器基本上回显请求 cookie。

可以通过这个stackblitz来访问.您可以切换 withCredentials 标志以查看响应的差异