页面刷新后JWT Cookie被删除问题（已设24小时有效期）

核心问题与修复方案 #

• JWT与Cookie有效期不匹配
  代码中JWT的expiresIn设为1小时，但Cookie的maxAge是24小时，两者周期不一致。即使Cookie未过期，JWT令牌1小时后就会失效，后续请求验证失败时可能触发Cookie清除逻辑。建议将JWT的过期时间与Cookie有效期统一，比如都设为24小时。

• secure属性的环境适配错误
  如果当前是HTTP开发环境，secure: true会导致浏览器拒绝存储Cookie——该属性要求Cookie仅通过HTTPS传输。可改为根据环境动态设置：生产环境（HTTPS）开启secure: true，开发环境（HTTP）设为false。

• sameSite: None的配套要求未满足
  当sameSite设为None时，必须同时开启secure: true，否则浏览器会忽略该Cookie。若为跨域场景，还需确保后端CORS配置允许携带凭证（credentials: true），前端请求时也要添加withCredentials: true，否则跨域Cookie无法正常存储或携带。

• 浏览器隐私拦截
  若用户开启了"阻止第三方Cookie"或使用隐私模式，sameSite: None的Cookie可能被拦截。同站场景下可将sameSite改为Lax，跨域场景则需确保站点在浏览器信任列表中。

调整后的示例代码 #

jwt.sign(userData, process.env.JWT_SECRET, {
  expiresIn: '24h' // 与Cookie有效期统一
}, (err, token) => {
  if (err) {
    console.log(err);
    return res.status(500).json({ success: false, message: 'Token generation failed' });
  }
  res.cookie('authToken', token, {
    maxAge: 24 * 60 * 60 * 1000, // 24小时
    httpOnly: true,
    secure: process.env.NODE_ENV === 'production', // 生产环境启用secure
    sameSite: process.env.NODE_ENV === 'production' ? 'None' : 'Lax', // 开发环境用Lax避免拦截
    path: '/'
  });
  res.json({
    "success": true,
    "message": 'Login successful'
  });
});

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