Set-Cookie 存在于标头中但未在浏览器中设置

Question

我们目前在客户端/API cookie 生成方面遇到错误。我们使用 Angular 12 和 NGINX 作为前端服务器，在 cms.domain.co.uk 的子域上运行 SSL；后端正在使用 SSL 在 api.domain.co.uk:3067 的子域上运行带有 pm2 的 node.js。

我们的后端nodejs文件具有以下CORS选项片段：

const app = express();
app.use(express.json());
app.use(cookieParser());
app.use(cors({
    origin: 'https://cms.domain.cloud',
    credentials: true,
    methods: 'GET, POST, OPTIONS',
    allowedHeaders: 'Origin, Content-Type, X-Auth-Token, Set-Cookie, Authorisation, Accept'
}));

我们在node.js文件中设置cookie，如下所示：

response.cookie('LoginCookie', sid, {httpOnly: true, secure: true, SameSite: "none"});

我们已经尝试了起源、标签和政策的所有可行组合，但现在我们正式陷入困境。请原谅我们对 CORS 的天真，因为我们来自非跨源背景。

来自服务器的响应标头包含 set-cookie 标签，但浏览器中未设置 cookie，允许在 POST 和 OPTIONS 中将凭证控件设置为 true，并设置来源以避免 CORS 错误。

这是发送的飞行前 OPTIONS 标头：

这是使用 Set-Cookie 标签发送的 POST 标头：

通过使用 chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security 启动另一个 chrome 窗口，浏览器会确认某个部分中存在 cookie，但不会另一个：

任何反馈或帮助将不胜感激！谢谢！

Answer 1

另一种方法是检索“LoginCookie”键 Set-Cookie 标头的值，并通过

document.cookie.setItem( 'LoginCookie', <data>)

将其存储到浏览器

Answer 2

如果您在前端使用 axios 来调用 api，那么添加“withCredentials:true”即可。