我正在使用firebase和会话cookies来验证react网站上的用户。后端正在使用谷歌云功能。当我在localhost上登录我的网站时,一切都很正常;我的react应用程序运行在localhost:3000
上,我的云功能运行在localhost:5000
上。我的初始化代码如下所示:
app.use(cors({credentials: true, origin: ['http://localhost:3000', 'https://beta.example.com','https://example.com']}));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(cookieParser());
登录代码如下所示:
const idToken = req.body.idToken.toString();
// Set session expiration to 5 days.
const expiresIn = 60 * 60 * 24 * 5 * 1000;
admin
.auth()
.createSessionCookie(idToken, { expiresIn })
.then((sessionCookie) => {
const options = { maxAge: expiresIn, httpOnly: true, secure: false };
res.cookie("session", sessionCookie, options);
return res.json({ message: "Logged in!" });
})
.catch((err) => {
console.log(err);
return res
.status(403)
.json({ general: "Wrong credentials, please try again" });
});
};
问题似乎是跨域的,因为我的网站托管在另一个域,而不是谷歌云功能,我不能设置cookie无论我尝试什么。我尝试过uuse axios和fetch来执行请求,它们都在localhost上工作。下面是从我的前端获取的信息:
fetch(api_url + "/login", {
method: "POST",
redirect: "follow",
credentials: "include", // Don't forget to specify this if you need cookies
headers: headers,
body: JSON.stringify({
idToken: idToken,
}),
}).then((res) => {
console.log("LOGGED IN!!!", res.data);
dispatch(getuserData(true, history, url));
});
当使用localhost时,我可以看到名为“session”的cookie,它正在按照它应该的方式创建;当我在我的网站上按下登录按钮。在我的自定义域上按相同的登录按钮时,此Cookie不存在
请注意,后端并没有崩溃,它只是由于某种原因没有将cookie保存在服务器上
Cookie不提供端口隔离。如果运行在一个端口上的服务可读取cookie,则运行在同一服务器的另一个端口上的服务也可读取该cookie。
这就是原因。当您在local上工作时,前端和后端api都属于localhost域。
在生产环境中,您可能会在不同的端点上部署前端和后端api。对于SPA应用程序,我建议使用localStorage而不是Cookies。