Node.js 无法从MERN应用中的后端接收/设置浏览器中的Cookie，后端托管在heroku上，前端托管在netlify上

我有一个MERN应用程序，其后端托管在Heroku上，前端托管在netlify上。部署应用程序后，我无法在浏览器中看到Cookie，但它在localhost上运行良好。我认为这是由于后端和前端端口不同，我缺少什么，请帮助

你是正确的。Cookie不跨域兼容。如果是，那将是一个严重的安全问题。解决问题的最简单方法是将cookie作为

res

对象发回，然后在前端手动设置cookie

以此为例。我将使用JavaScript风格的伪代码来实现这一点。不要复制粘贴此项，因为此项很可能无法立即工作。这是您将在后端执行的操作：

// 1. Authenticate the user.
const userData = await authenticateUser();
const userToken = await verifyUser(userData);

// 2. Return the response object.
return response.status(200).json({
  status: 'success',
  data: userData,
  token: userToken,
});

在前端：

const response=wait axios.post（…）；//您的API调用将返回上述对象。
//在此处设置您的身份验证令牌。
//“options”对象将包含所有可能的cookie选项，例如“secure”。
cookies.set（'token'，response.data.token，options）；
//或者，在本地存储器中设置cookie。
setItem（'token'，response.data.token）；

您需要在前端相应地设置cookie

进一步阅读：

---

编辑：您的问题不清楚。您第一次谈论cookies，但现在您谈论的是

httpOnly

cookies。请在你的问题中更具体一些

如果React.js是跨域的，则无法在React.js中设置

httpOnly

cookies。React只负责“查看”网站

httpOnly

Cookie只能在服务器端设置。客户端JavaScript无法读取或设置该特定cookie，但可以发送该cookie。除非您的网络中有可以执行服务器端操作的东西，否则我认为这是不可能的

---

您最好只使用同一个域。

我使用的是httpOnly cookie，因此我可以设置cookie值，但无法在react中读取其值，因此如何将cookie值发送到后端？由于后端位于不同的域，因此我必须从前端发送cookie值，因为我无法在后端直接访问它。我还没有尝试过，但您可能可以使用

axios

的

withCredentials

选项，但您可能必须在后端设置CORS及其来源。如果您使用不同的域，恐怕处理

httpOnly

cookie有点困难。更容易使用

localStorage

。如果您使用的是Next.js，您可以使用它的API路由来处理

httpOnly

cookies，但我们这里讨论的是React，而不是Next.js。因此，如果我在Axios实例中将“withCredentials”选项设置为true，那么httpOnly cookies是否会自动发送到后端，而无需在客户端上读取它们？应该是这样的。但是，您的服务器应配置为接受来自跨域的cookie。这可以使用

cors

完成。我还没有试过，但它应该是可行的。更新了我的答案。基本上，这是不可能的，除非您的Netlify中有服务器端操作

httpOnly

cookies无法在前端访问。