Question

我已经尝试了多种配置并阅读了有关此问题的多个帖子，但我仍然迷路。

我的api服务器发送的自定义Cookie被浏览器接收，但从未存储。而且我不知道为什么。

我开发了部署在heroku上的node / express api服务器。

我的前端使用Vuejs并部署在firebase上。

以下是与我的cookie配置相关的代码：

服务器端

Cors

app.use(
    cors({
        origin: 'https://my-app.firebaseapp.com',
        credentials: true,
    exposedHeaders: ['customCookie']
    })
);

Set-cookie

const cookieOptions = {
    httpOnly: true,
    sameSite: 'None',
    expires: expirationDate,
    secure: true,
    path: '/',
    domain: 'https://my-app.firebaseapp.com',
};

res.cookie('customCookie', 'value', cookieOptions)

客户侧

Axios

axios.defaults.baseURL = 'https://my-app.herokuapp.com';
axios.defaults.withCredentials = true;

请求头

POST /auth/sign-in HTTP/1.1
Host: my-app.herokuapp.com
Connection: keep-alive
Content-Length: 55
Pragma: no-cache
Cache-Control: no-cache
Origin: https://my-app.firebaseapp.com
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3921.0 Safari/537.36
Content-Type: application/json;charset=UTF-8
Accept: */*
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Referer: https://my-app.firebaseapp.com/auth/sign-in
Accept-Encoding: gzip, deflate, br
Accept-Language: fr-FR,fr;q=0.9,en-US;q=0.8,en;q=0.7,nl;q=0.6,la;q=0.5

响应头

HTTP/1.1 200 OK
Server: Cowboy
Connection: keep-alive
X-Dns-Prefetch-Control: off
X-Frame-Options: SAMEORIGIN
Strict-Transport-Security: max-age=15552000; includeSubDomains
X-Download-Options: noopen
X-Content-Type-Options: nosniff
X-Xss-Protection: 1; mode=block
Access-Control-Allow-Origin: https://my-app.firebaseapp.com
Vary: Origin, Accept-Encoding
Access-Control-Allow-Credentials: true
Access-Control-Expose-Headers: customCookie
Set-Cookie: customCookie=value; Domain=https://my-app.firebaseapp.com; Path=/; Expires=Sun, 17 Nov 2019 11:54:30 GMT; HttpOnly; Secure; SameSite=None
Content-Type: application/json; charset=utf-8
Content-Length: 200
Etag: W/"c8-qlzfwyZ+uJQMQIeJOQnFSQYPR6o"
Date: Sun, 20 Oct 2019 11:54:30 GMT
Via: 1.1 vegur

因此，在此处正确发送和接收了cookie：

Set-Cookie: customCookie=value; Domain=https://my-app.firebaseapp.com; Path=/; Expires=Sun, 17 Nov 2019 11:54:30 GMT; HttpOnly; Secure; SameSite=None

但是当我检查选项卡时：Google开发工具>>应用程序>> Cookies >> my-app ...

=>没有存储cookie，因此该cookie不会在后续请求中发送...

有什么想法/建议吗？

非常感谢您的帮助，

罗曼

Answer 1

我认为您需要处理Access-Control。

您可以通过添加以下代码来实现

app.use(function(req, res, next) {
    res.header('Access-Control-Allow-Credentials', true);
    res.header('Access-Control-Allow-Origin', req.headers.origin);
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept');
    next();
});

此外，我想您正在使用Chrome浏览器，是否可以在没有安全性的情况下运行Chrome 这样做，然后检查您的cookie是否存储

“ C：\ Program Files（x86）\ Google \ Chrome \ Application \ chrome.exe” --user-data-dir =“ C：/ Chrome开发者会话” --args --disable-web-security

Answer 2

我想我明白了。

在Chrome（可能还有其他导航器）中，Cookie似乎仅存储在域名中，而在我的情况下，该域名应该是服务器应用（my-app.herokuapp.com），而不是客户端应用（my-app.firebaseapp.com）。

换句话说，我认为我的cookie将在我的客户端应用程序地址中存储并可见，但实际上在我的域名地址中存储并可见。

现在一切正常...

自定义Cookie已发送到浏览器但未存储

2 个答案: