如何用JWT生成Token做认证？Node.js+React+TS Cookie无Token报错求助

以下是针对你遇到的"未在Cookie中找到Token"问题的排查和解决要点：

• 检查Cookie的SameSite与Secure属性
  Node.js设置Cookie时，跨域场景下需确保SameSite配置正确。如果前后端域名/端口不同，SameSite设为Strict或Lax会限制Cookie跨域携带。生产环境必须搭配secure: true（仅HTTPS传输），本地开发可根据环境调整：

  res.cookie('token', jwtToken, {
    httpOnly: true, // 防止XSS攻击，前端无法通过JS读取
    secure: process.env.NODE_ENV === 'production',
    sameSite: process.env.NODE_ENV === 'production' ? 'None' : 'Lax',
    maxAge: 24 * 60 * 60 * 1000 // 有效期1天
  });
  

• 确认CORS配置完整性
  后端CORS必须同时指定允许的前端Origin和开启credentials，且Origin不能设为*（否则credentials会失效）：

  const cors = require('cors');
  const corsOptions = {
    origin: process.env.FRONTEND_URL || 'http://localhost:3000', // 前端实际地址
    credentials: true // 允许携带Cookie
  };
  app.use(cors(corsOptions));
  

• 前端请求credentials设置
  所有需要验证身份的fetch请求必须显式设置credentials: 'include'，跨域场景下不能用'same-origin'：

  fetch('/api/protected', {
    method: 'GET',
    credentials: 'include'
  })
  .then(res => {
    if (!res.ok) throw new Error('请求失败');
    return res.json();
  })
  .then(data => console.log(data));
  

• 代理路径匹配检查
  若package.json中的代理为字符串格式，仅会转发根路径请求。如果后端接口有前缀（如/api），建议改用对象配置确保路径正确转发：

  "proxy": {
    "/api": {
      "target": "http://localhost:5000",
      "changeOrigin": true,
      "secure": false // 本地开发HTTP环境下设为false
    }
  }
  

• 后端Cookie解析方式
  确保已安装并启用cookie-parser中间件，避免手动解析req.headers.cookie导致的错误：

  const cookieParser = require('cookie-parser');
  app.use(cookieParser());
  
  // 身份验证中间件
  const authenticateToken = (req, res, next) => {
    const token = req.cookies.token;
    if (!token) return res.status(401).send('未在Cookie中找到Token');
    // JWT验证逻辑
    jwt.verify(token, process.env.JWT_SECRET, (err, user) => {
      if (err) return res.status(403).send('Token无效');
      req.user = user;
      next();
    });
  };
  

• 浏览器隐私设置排查
  本地开发时，若浏览器开启"阻止第三方Cookie"，localhost跨端口请求会被判定为第三方，导致Cookie无法携带。可暂时关闭该设置，或通过修改hosts文件将前后端映射为同主域名的子域名（如local.frontend.com和local.backend.com）。

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