深入解析：access token在哪存储最安全？从原理到实践的全方位指南

1次阅读

没有评论

共计 1737 个字符，预计需要花费 5 分钟才能阅读完成。

在现代 Web 开发中，access token 是身份验证和授权的核心机制。它通常由服务器颁发，客户端在后续请求中携带该 token 以证明自己的身份。然而，access token 的存储位置选择不当可能导致严重的安全问题，例如：

如果 token 被恶意脚本窃取，攻击者可以冒充用户进行非法操作
不安全的存储方式可能导致 token 泄露，造成用户数据被篡改或窃取
错误的存储方案可能使应用面临 CSRF、XSS 等攻击的风险

优点：
– 存储容量较大（通常 5MB 左右）
– 数据持久化，关闭浏览器后依然存在

缺点：
– 易受 XSS 攻击
– 没有过期机制
– 同源策略限制

优点：
– 会话级别的存储，关闭标签页后自动清除
– 比 localStorage 稍微安全一些

缺点：
– 仍然易受 XSS 攻击
– 页面刷新后数据依然存在
– 同源策略限制

优点：
– 可以设置 HttpOnly 和 Secure 标志
– 支持过期时间
– 浏览器自动管理

缺点：
– 容量限制（约 4KB）
– 可能面临 CSRF 攻击
– 每次请求都会自动携带，增加带宽消耗

优点：
– 最安全的存储方式
– 完全不受 XSS 攻击影响
– 页面刷新或关闭后自动清除

缺点：
– 不能持久化
– 单页应用切换路由时可能丢失

// 存储 token
localStorage.setItem('access_token', 'your_token_value');

// 获取 token
const token = localStorage.getItem('access_token');

// 删除 token
localStorage.removeItem('access_token');

// 设置 cookie（服务器端实现）// 以 Node.js Express 为例
res.cookie('access_token', 'your_token_value', {
  httpOnly: true,
  secure: true,
  sameSite: 'strict',
  maxAge: 3600000 // 1 小时过期
});

// 客户端无法直接读取 HttpOnly cookie
// 删除 cookie
res.clearCookie('access_token');

let token = null;

// 存储 token
function setToken(newToken) {token = newToken;}

// 获取 token
function getToken() {return token;}

// 清除 token
function clearToken() {token = null;}