在一天多的时间里，我尝试了你所有的建议和更多的建议，我投降了。
Chrome只是不接受我的跨域cookie在本地主机。
没有错误，只是默默地忽略。
我想有http仅饼干更安全的存储令牌。
所以对于localhost来说，代理听起来是最好的解决方法。我还没试过。
我最后做的事，也许能帮到别人。
后端(节点/快递/打印稿)
像往常一样设置cookie
res.status(200).cookie("token", token, cookieOptions)
为localhost做一个工作
// if origin localhost
response.setHeader("X-Set-Cookie", response.getHeader("set-cookie") ?? "");
在cors中允许x-set-cookie头
app.use(cors({
//...
exposedHeaders: [
"X-Set-Cookie",
//...
]
}));
前端(Axios)
关于Axios响应
删除域=，所以它是默认的。
拆分多个cookie并存储在本地。
// Localhost cookie work around
const xcookies = response.headers?.["x-set-cookie"];
if(xcookies !== undefined){
xcookies
.replace(/\s+Domain=[^=\s;]+;/g, "")
.split(/,\s+(?=[^=\s]+=[^=\s]+)/)
.forEach((cookie:string) => {
document.cookie = cookie.trim();
});
}
不理想，但我可以继续我的生活了。
总的来说，我认为这太复杂了:-(
更新我的用例，也许我们可以解决它?
这是一个自定义域名的heroku服务器。
根据这篇文章，这应该是可以的
https://devcenter.heroku.com/articles/cookies-and-herokuapp-com
我做了一个孤立的测试用例，但仍然没有乐趣。
我很确定我以前在FireFox中见过它的工作，但目前似乎没有什么工作，除了我讨厌的工作。
服务器端
app.set("trust proxy", 1);
app.get("/cors-cookie", (request: Request, response: Response) => {
// http://localhost:3000
console.log("origin", request.headers?.["origin"]);
const headers = response.getHeaders();
Object.keys(headers).forEach(x => {
response.removeHeader(x);
console.log("remove header ", x, headers[x]);
});
console.log("headers", response.getHeaders());
const expiryOffset = 1*24*60*60*1000; // +1 day
const cookieOptions:CookieOptions = {
path: "/",
httpOnly: true,
sameSite: "none",
secure: true,
domain: "api.xxxx.nl",
expires: new Date(Date.now() + expiryOffset)
}
return response
.status(200)
.header("Access-Control-Allow-Credentials", "true")
.header("Access-Control-Allow-Origin", "http://localhost:3000")
.header("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT")
.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept")
.cookie("test-1", "_1_", cookieOptions)
.cookie("test-2", "_2_", {...cookieOptions, ...{ httpOnly: false }})
.cookie("test-3", "_3_", {...cookieOptions, ...{ domain: undefined }})
.cookie("test-4", "_4_", {...cookieOptions, ...{ domain: undefined, httpOnly: false }})
.cookie("test-5", "_5_", {...cookieOptions, ...{ domain: undefined, sameSite: "lax" }})
.cookie("test-6", "_6_", {...cookieOptions, ...{ domain: undefined, httpOnly: false, sameSite: "lax" }})
.cookie("test-7", "_7_", {...cookieOptions, ...{ domain: "localhost"}}) // Invalid domain
.cookie("test-8", "_8_", {...cookieOptions, ...{ domain: ".localhost"}}) // Invalid domain
.cookie("test-9", "_9_", {...cookieOptions, ...{ domain: "http://localhost:3000"}}) // Invalid domain
.json({
message: "cookie"
});
});
客户端
const response = await axios("https://api.xxxx.nl/cors-cookie", {
method: "get",
withCredentials: true,
headers: {
"Accept": "application/json",
"Content-Type": "application/json",
}
});
哪个会产生以下响应
我在网络>请求> cookie选项卡中看到cookie。
但是在Application > Storage > cookies和document.cookie中没有cookie。
