Skip to main content

完全可以通过 Cookie 进行 JWT 授权，把 access_token 放在 Cookie 中。

很多现代 Web 应用（尤其是前后端分离的项目）都采用 JWT + HttpOnly Cookie 的方式，这比每次手动在 Header 里带 Token 更方便，也更安全（在防范 XSS 方面）。

1. 两种常见做法对比​

方式优点缺点适用场景
Header (Bearer)更符合 RESTful、无状态、跨域灵活每次请求都要手动携带，易被 XSS 窃取API 重度项目、移动端
Cookie浏览器自动携带、支持 HttpOnly 防 XSS存在 CSRF 风险、Cookie 大小限制普通 Web 网站、B/S 系统

后端（推荐做法）：​

// 登录成功后设置 Cookie
res.cookie('access_token', jwtToken, {
  httpOnly: true,      // 关键：禁止 JS 读取，防 XSS
  secure: true,        // 只在 HTTPS 下传输
  sameSite: 'strict',  // 或 'lax'，强烈推荐防 CSRF
  maxAge: 15 * 60 * 1000, // 例如 15 分钟
  path: '/'
});

读取 Token 的方式（中间件）：

const token = req.cookies.access_token;   // 使用 cookie-parser 等中间件

if (!token) return res.status(401).json({ msg: '未授权' });

// 验证 JWT
jwt.verify(token, secret, (err, payload) => { ... });

你也可以同时支持 Header 和 Cookie，让前端灵活选择：

const token = req.headers.authorization?.split(' ')[1] || req.cookies.access_token;

3. 前端调用方式​

使用 Cookie 后，前端不需要再手动设置 Authorization header：

// fetch 示例
fetch('/api/user', {
  credentials: 'include'   // 关键：允许携带 Cookie
});

// axios 示例
axios.defaults.withCredentials = true;

4. 重要安全建议​

  1. 必须使用 HttpOnly，防止 XSS 攻击窃取 Token。
  2. 必须使用 Secure + SameSite（至少 SameSite=Lax）。
  3. Token 有效期尽量短（15~60 分钟），配合 Refresh Token（通常也放在另一个 HttpOnly Cookie）。
  4. 做好 CSRF 防护（SameSite=Strict + CSRF Token 双保险最佳）。
  5. 避免在 Cookie 中存放敏感信息（JWT 本身就是可验证的）。

5. 实际推荐架构（主流做法）​

  • access_token：短有效期，放在 HttpOnly Cookie
  • refresh_token：更长有效期，也放在 HttpOnly Cookie
  • 登录/刷新接口返回 Set-Cookie
  • 需要登出时：res.clearCookie('access_token')

总结：
完全可以把 JWT 放在 Cookie 里，而且在 Web 网站场景下往往是更好的选择。只要正确配置 httpOnly + secure + sameSite，安全性比纯 Header 方式更高。

需要我给你前后端具体的完整代码示例吗？（Node.js / NestJS / Spring Boot 等）