如何优雅处理401 invalid access token or token expired：从原理到实战解决方案

1次阅读

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

在现代 Web 开发中，基于 Token 的认证机制（如 JWT、OAuth2）已成为主流。然而，Token 的失效问题常常给开发者带来困扰，尤其是当用户在使用应用时突然遇到 401 invalid access token or token expired 错误时，体验会大打折扣。

Token 失效通常有以下几个原因：

Token 过期：这是最常见的情况。JWT 和 OAuth2 Token 都有预设的有效期，过期后即失效。
用户主动注销：用户退出登录或管理员撤销了 Token。
安全策略变更：如密码修改后，旧 Token 被强制失效。
服务器重启或集群环境下 Token 存储不一致。

这些问题的存在会导致：

用户体验下降：频繁需要重新登录
系统稳定性受影响：API 调用失败率上升
安全性风险：如果处理不当，可能导致 Token 被非法利用

针对 Token 失效问题，业界有几种主流解决方案：

JWT with Refresh Token
优点：无状态，实现简单
缺点：Refresh Token 本身也存在安全问题
OAuth2 Token Rotation
优点：每次刷新都获得新 Token，更安全
缺点：实现复杂度较高
短期 Token+ 长期 Session
优点：平衡安全性与用户体验
缺点：需要维护 Session 状态

从实践角度看，JWT with Refresh Token 方案在大多数场景下已足够，下面我们重点介绍这种实现。

const jwt = require('jsonwebtoken');
const axios = require('axios');

// 验证 Access Token 的中间件
async function authMiddleware(req, res, next) {const accessToken = req.headers['authorization']?.split(' ')[1];

  if (!accessToken) {return res.status(401).json({error: 'No token provided'});
  }

  try {
    // 验证 Access Token
    const decoded = jwt.verify(accessToken, process.env.ACCESS_TOKEN_SECRET);
    req.user = decoded;
    return next();} catch (err) {if (err.name === 'TokenExpiredError') {
      // Token 过期，尝试用 Refresh Token 获取新 Token
      const refreshToken = req.cookies.refreshToken;

      if (!refreshToken) {return res.status(401).json({error: 'Refresh token missing'});
      }

      try {
        // 调用 Token 刷新接口
        const response = await axios.post('/api/refresh-token', { refreshToken});
        const newAccessToken = response.data.accessToken;

        // 设置新 Token 到响应头
        res.set('Access-Control-Expose-Headers', 'New-Access-Token');
        res.set('New-Access-Token', newAccessToken);

        // 继续处理请求
        const decoded = jwt.decode(newAccessToken);
        req.user = decoded;
        return next();} catch (refreshError) {return res.status(401).json({error: 'Invalid refresh token'});
      }
    }

    return res.status(401).json({error: 'Invalid token'});
  }
}

const apiClient = axios.create();

// 请求拦截器
apiClient.interceptors.request.use(config => {const accessToken = localStorage.getItem('accessToken');
  if (accessToken) {config.headers.Authorization = `Bearer ${accessToken}`;
  }
  return config;
});

// 响应拦截器
apiClient.interceptors.response.use(
  response => response,
  async error => {
    const originalRequest = error.config;

    // 检测到 401 错误且不是刷新 Token 的请求
    if (error.response.status === 401 && !originalRequest._retry) {
      originalRequest._retry = true;

      try {
        // 尝试刷新 Token
        const refreshToken = localStorage.getItem('refreshToken');
        const response = await axios.post('/api/refresh-token', { refreshToken});

        // 存储新 Token
        localStorage.setItem('accessToken', response.data.accessToken);

        // 重试原始请求
        originalRequest.headers.Authorization = `Bearer ${response.data.accessToken}`;
        return apiClient(originalRequest);
      } catch (refreshError) {
        // 刷新失败，跳转到登录页
        window.location.href = '/login';
        return Promise.reject(refreshError);
      }
    }

    return Promise.reject(error);
  }
);

在实现 Token 自动刷新机制时，需要注意以下安全风险：