Express后端中间件无法获取Cookie问题求助

1. 移除后端中间件中的React钩子（致命错误） #

你在后端authMiddleware里错误导入了useCookies——这是React专属的Hook，只能在React组件内部使用，Node.js后端环境无法识别，会导致潜在运行错误，立刻删掉这行：

// 删掉这行！后端不需要也不能用这个
import { useCookies } from "react-cookie";

2. 修正前端Cookie的设置参数 #

确保用react-cookie设置Cookie时，配置正确的path和SameSite属性，否则Cookie无法被后端接收：

import { useCookies } from "react-cookie";

function App() {
  const [, setCookie] = useCookies(["id"]);

  const handleLogin = () => {
    setCookie("id", "用户ID值", {
      path: "/", // 关键：让Cookie在整个域名下生效，包括/expense路径
      sameSite: "lax", // 开发环境用lax即可，生产环境按需调整
      secure: process.env.NODE_ENV === "production", // 生产环境开启HTTPS时需设为true
      maxAge: 3600 * 24 * 7 // 可选：设置Cookie过期时间（7天）
    });
  };

  // ...其他代码
}

若path设为/expense，仅访问该路径开头的接口时才会携带Cookie，通常设为/更合理。

3. 确保所有请求都携带Cookie #

你已在deleteExpense中设置credentials: 'include'，但要确认所有API请求都配置了该参数，比如RTK Query可全局配置：

const api = createApi({
  baseQuery: fetchBaseQuery({
    baseUrl: "/",
    credentials: "include" // 全局生效，所有请求自动携带Cookie
  }),
  // ...其他配置
});

同时打开浏览器开发者工具的Network面板，查看请求头是否存在Cookie字段——若没有，说明请求未携带Cookie，需排查配置。

4. 验证前端代理配置（若使用代理） #

如果前端通过代理访问后端（如create-react-app的代理），确保package.json的proxy指向正确的后端端口：

{
  "proxy": "http://localhost:5000" // 替换为你的后端运行端口
}

且前端请求用相对路径（如/expense/xxx），而非绝对路径（如http://localhost:5000/expense/xxx），否则浏览器会判定为跨域，拒绝携带Cookie。

5. 后端验证Cookie解析 #

添加测试路由确认cookie-parser是否正常工作：

app.get("/test-cookie", (req, res) => {
  console.log("测试请求的Cookie:", req.cookies);
  res.send(req.cookies);
});

在浏览器访问该路由，查看控制台输出和页面响应，确认是否能获取到Cookie。

6. 检查SameSite与Secure属性 #

若前端设置sameSite: 'strict'，部分场景下（如跨页面跳转）Cookie不会被发送，开发环境建议用lax；生产环境若启用HTTPS，需将Cookie的secure设为true，否则浏览器不会发送Cookie。

内容的提问来源于stack exchange，提问作者Mathew