前后端token自动续期方案

最新推荐文章于 2025-10-14 21:45:50 发布
原创 最新推荐文章于 2025-10-14 21:45:50 发布 · 1.2k 阅读 · 29 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#前后端分离 #vue #access token

目录

在前后端分离架构中，Token 是实现身份认证的核心机制，但 Token 过期会导致用户操作中断，影响体验。因此，自动续期方案是保障用户持续访问的关键。以下是几种主流的 Token 自动续期方案，包含原理、实现细节及安全性考量。

一、刷新 Token（Refresh Token）机制

这是目前最成熟、应用最广泛的方案，核心是通过“双 Token 体系”实现续期，兼顾安全性和用户体验。

1. 核心原理
  • Access Token（访问令牌）：短期有效（如 15 分钟），用于接口访问，权限范围小，泄露风险低。
  • Refresh Token（刷新令牌）：长期有效（如 7 天），仅用于获取新的 Access Token，权限范围仅为“续期”，泄露影响可控。

当 Access Token 过期时，前端用未过期的 Refresh Token 向后端换取新的 Access Token，避免用户重新登录。

2. 前后端实现流程
前端实现（以 Axios 为例）

  • 存储 Token：Access Token 存在内存或 httpOnly Cookie（推荐，防 XSS）；Refresh Token 存在 httpOnly Cookie（避免前端 JS 读取，增强安全性）。

  • 请求拦截器：每次请求在 Header 中携带 Access Token（如 Authorization: Bearer {accessToken}）。

  • 响应拦截器：处理 401 错误（Access Token 过期）：

    • 若存在 Refresh Token，调用后端“刷新接口”获取新 Access Token。
    • 刷新成功后，更新本地 Access Token，并重试原请求。
    • 若 Refresh Token 也过期（刷新接口返回 401），则清除本地 Token，跳转至登录页。
    // 响应拦截器示例
axios.interceptors.response.use(
  (response) => response,
  async (error) => {
    const originalRequest = error.config;
    // 若为401且未尝试过刷新
    if (error.response.status === 401 && !originalRequest._retry) {
      originalRequest._retry = true; // 标记已尝试刷新，避免重复请求
      try {
        // 调用刷新接口（Refresh Token 通过 Cookie 自动携带）
        const { data } = await axios.post('/api/refresh-token');
        // 更新本地 Access Token
        localStorage.setItem('accessToken', data.accessToken);
        // 重试原请求（携带新 Token）
        originalRequest.headers['Authorization'] = `Bearer ${data.accessToken}`;
        return axios(originalRequest);
      } catch (refreshError) {
        // 刷新失败（Refresh Token 过期），跳转登录
        window.location.href = '/login';
        return Promise.reject(refreshError);
      }
    }
    return Promise.reject(error);
  }
);

  • 并发请求处理：若多个请求同时触发 401，需避免重复刷新 Token。可通过“锁机制”实现：刷新过程中阻塞其他请求，等待新 Token 生成后统一重试。

后端实现

  • 生成 Token：登录成功时，同时生成 Access Token（短期）和 Refresh Token（长期），返回给前端（Access Token 可放响应体，Refresh Token 放 httpOnly Cookie）。

  • 验证 Access Token：接口请求时，验证 Access Token 的签名和有效期，无效则返回 401。

  • 刷新接口实现：

    • 接收 Refresh Token（从 Cookie 或请求体获取），验证其有效性（是否存在于数据库、未过期、未被吊销）。
    • 验证通过后，生成新的 Access Token（和新的 Refresh Token，可选，增强安全性）。
    • 返回新 Token 给前端。
    // 后端刷新接口示例（伪代码）
@PostMapping("/api/refresh-token")
public Result refreshToken(HttpServletRequest request) {
  // 从 Cookie 获取 Refresh Token
  String refreshToken = CookieUtils.getCookieValue(request, "refreshToken");
  if (refreshToken == null) {
    return Result.fail(401, "刷新令牌不存在");
  }
  // 验证 Refresh Token（查库+验签）
  RefreshTokenEntity entity = refreshTokenMapper.selectByToken(refreshToken);
  if (entity == null || entity.getExpireTime().before(new Date())) {
    return Result.fail(401, "刷新令牌已过期");
  }
  // 生成新 Access Token 和 Refresh Token
  String newAccessToken = JwtUtils.generateAccessToken(entity.getUserId());
  String newRefreshToken = JwtUtils.generateRefreshToken(entity.getUserId());
  // 更新数据库中的 Refresh Token（旧的标记失效，存储新的）
  refreshTokenMapper.invalidateOldToken(entity.getId());
  refreshTokenMapper.insert(new RefreshTokenEntity(newRefreshToken, entity.getUserId()));
  // 返回新 Token（Access Token 放响应体，Refresh Token 放 httpOnly Cookie）
  return Result.success(Map.of(
    "accessToken", newAccessToken,
    "refreshToken", newRefreshToken // 可选，通过 Cookie 返回更安全
  ));
}
3. 优缺点
  • 优点：安全性高（Access Token 短期有效，泄露影响小；Refresh Token 可吊销）；用户体验好（无需频繁登录）。
  • 缺点：实现较复杂（需维护双 Token 逻辑）；需后端存储 Refresh Token（增加存储成本）。

二、滑动窗口续期（无 Refresh Token）

适用于对安全性要求中等、希望简化实现的场景，核心是“Token 快过期时自动延长有效期”。

1. 核心原理
  • 仅使用一个 Access Token，有效期设为中等（如 1 小时）。
  • 当 Token 剩余有效期小于阈值（如 10 分钟）时，前端请求接口时，后端自动生成新 Token 并返回，前端更新本地 Token。
  • 本质是“用持续活跃的请求延长 Token 有效期”，类似“用户活跃则会话不失效”。
2. 前后端实现流程
前端实现

  • 存储 Token 并在请求头携带。

  • 每次收到响应后，检查是否包含新 Token（如响应头 X-New-Token），若有则更新本地存储。

    // 响应拦截器示例
axios.interceptors.response.use(
  (response) => {
    // 若响应头有新 Token，更新本地存储
    const newToken = response.headers['x-new-token'];
    if (newToken) {
      localStorage.setItem('accessToken', newToken); // 建议用 Cookie
    }
    return response;
  },
  (error) => {
    // 若 Token 已过期（401），直接跳转登录
    if (error.response?.status === 401) {
      window.location.href = '/login';
    }
    return Promise.reject(error);
  }
);
后端实现

  • Token 中包含过期时间（如 exp 字段）。

  • 每次验证 Token 时，计算剩余有效期：若剩余时间 < 阈值（如 10 分钟），则生成新 Token，放在响应头（如 X-New-Token）返回。

    // 验证 Token 并判断是否续期（伪代码）
public String validateAndRenewToken(String token) {
  // 验证 Token 签名和有效性
  Claims claims = JwtUtils.parseToken(token);
  if (claims == null) {
    throw new TokenInvalidException();
  }
  // 计算剩余有效期（当前时间到 exp 的差值）
  long expireTime = claims.getExpiration().getTime();
  long remainingTime = expireTime - System.currentTimeMillis();
  // 若剩余时间 < 10 分钟，生成新 Token
  if (remainingTime < 10 * 60 * 1000) {
    String newToken = JwtUtils.generateAccessToken(claims.getSubject()); // 用原用户 ID 生成新 Token
    return newToken;
  }
  return null; // 无需续期
}
3. 优缺点
  • 优点：实现简单（无需维护 Refresh Token）；用户体验流畅（无感续期）。
  • 缺点：安全性较低（Token 有效期较长，泄露后风险更高）；无法处理“用户长时间不操作”的场景（Token 会直接过期）。

三、主动预检续期

适用于对请求成功率要求高的场景，前端主动检测 Token 有效期，提前续期。

1. 核心原理
  • 前端每次发送请求前，检查 Token 剩余有效期：
    • 若剩余时间 > 阈值（如 5 分钟）：直接发送请求。
    • 若剩余时间 ≤ 阈值：先发送续期请求获取新 Token，再发送原请求。
  • 避免了“请求因 Token 过期失败后重试”的情况，更主动。
2. 前后端实现流程
前端实现（请求拦截器中处理）
axios.interceptors.request.use(async (config) => {
  const token = localStorage.getItem('accessToken');
  if (!token) {
    window.location.href = '/login';
    return Promise.reject(new Error('未登录'));
  }
  // 解析 Token 中的过期时间（需前端解析 JWT，或后端返回过期时间）
  const payload = JSON.parse(atob(token.split('.')[1]));
  const expireTime = payload.exp * 1000; // JWT 的 exp 是秒级时间戳
  const remainingTime = expireTime - Date.now();
  
  // 若剩余时间 ≤ 5 分钟，先续期
  if (remainingTime <= 5 * 60 * 1000) {
    try {
      const { data } = await axios.post('/api/renew-token', { token });
      const newToken = data.newToken;
      localStorage.setItem('accessToken', newToken);
      config.headers['Authorization'] = `Bearer ${newToken}`;
    } catch (error) {
      // 续期失败，跳转登录
      window.location.href = '/login';
      return Promise.reject(error);
    }
  } else {
    config.headers['Authorization'] = `Bearer ${token}`;
  }
  return config;
});
后端实现
  • 提供专门的续期接口（/api/renew-token），接收旧 Token，验证有效性后返回新 Token。
  • 逻辑与滑动窗口的后端类似，但触发时机由前端主动控制。
3. 优缺点
  • 优点：避免请求失败重试，成功率高；主动处理续期，流程更可控。
  • 缺点：增加了一次预检请求（性能损耗小）；需前端解析 Token 过期时间（JWT 可解析，非 JWT 需后端额外返回）。

四、安全性与最佳实践

  1. Token 存储：

    • 优先用 httpOnly + Secure + SameSite Cookie 存储（防 XSS、CSRF 攻击）。
    • 避免用 localStorage/sessionStorage（易被 XSS 窃取）。

  2. 过期时间设置：

    • Access Token：短期（15 分钟 ~ 1 小时），减少泄露影响。
    • Refresh Token：中期（7 ~ 30 天），兼顾体验与安全；可设置“绝对过期时间”（如 30 天），强制用户定期登录。

  3. Refresh Token 轮换：

    • 每次用 Refresh Token 换取新 Access Token 时，同步生成新的 Refresh Token（旧的立即失效），防止 Refresh Token 被复用。

  4. HTTPS 传输：所有 Token 必须通过 HTTPS 传输，防止中间人攻击。

  5. 并发请求处理：

    • 用“锁机制”（如 Promise 等待）处理多个请求同时触发续期的场景，避免重复调用刷新接口。

  6. Token 吊销：

    • 后端需支持主动吊销 Token（如用户登出、修改密码时），可通过“黑名单”（Redis 存储已吊销 Token）实现快速验证。

总结

  • 追求安全性：优先选 Refresh Token 机制（双 Token 体系）。
  • 追求简单实现：选 滑动窗口续期（无 Refresh Token）。
  • 追求请求成功率：选 主动预检续期（前端提前处理）。

实际场景中，可结合业务需求（如用户活跃度、安全等级）选择方案，核心是在“用户体验”与“安全性”之间找到平衡。

分布式系统中Token续期问题解决方案
算法小生
07-27 1207
时，主要目标是确保用户在Token过期后能够无缝继续使用服务，而无需频繁重新登录，从而提升用户体验并兼顾安全性。在现代前后端分离项目中，
spring-security-oauth2做前后端分离实现无感知token续期
单筱风的博客
01-21 2248
1.问题由来 接触java已经将近3年现在大四在实习了，以前自己写的项目最多只用到了spring-security做权限认证其中的token是用jwt实现的，也考虑和使用过响应头返回新token前端判断替换token来实现访问续期的，但是总觉得不是很方便。 现在正在学习使用spring-security-oauth2做认证和授权，登录返回的AccessToken和RefreshToken可以很好地帮助我实现token续期。其中用到了oauth2的相关知识，在此不做解释。 2.前端vue处理 请求响应拦截添加
20张图全面剖析 AI 大模型应用工程化技术架构
m0_71746299的博客
08-21 903
本文通过20张技术架构图全面解析AI大模型应用工程化的关键领域，包括RAG架构演进、多智能体设计模式、评估框架、协议对比等核心内容。重点剖析了Agentic RAG技术栈、智能体系统分解、记忆系统设计等前沿方向，并对比了传统RAG与Agentic RAG的差异。文章还提供了智能体开发全流程指南，涵盖6个开发阶段、9种RAG架构设计及20个专业术语，最后展望了2025年AI智能体发展趋势。文末附赠全套AI大模型学习资源获取方式。
JWT token过期后自动续期的解决方案
leeta的博客
08-20 4731
在文中给出的例子中，仅实现了登录认证，但是并没有设置token的过期时间，在实际应用中，token一般都需要设置过期时间。 如何设置token的过期时间 前文《Java面试常见问题：JWT是什么？》介绍过，JWT token的payload部分是一个json串，是要传递数据的一组声明，这些声明被JWT标准称为claims。 JWT标准里面定义的标准claim包括： iss(Issuser)：JWT的签发主体； sub(Subject)：JWT的所有者； aud(Audience)：JWT的接..
token续期的5种方案
最新发布
jj1245_的博客
10-14 835
Token续期不是简单的时间重置，而是安全、用户体验和系统性能的三方博弈。这种实现会导致：• 用户操作中断（Token突然过期）• 安全风险（旧Token继续有效）• 并发问题（多个请求同时触发刷新）
如何实现token续期——双token实现
TaloyerG的博客
10-24 1776
我们知道token的失效时间，是在创建时就规定的时间，如果时间一到，用户即使任然在操作，那么也会强制退出，体验非常不好，本文介绍token续期的常见方式之一双token。
基于token的身份认证及自动续期的解决方案
代码大师麦克拉瑞的博客
03-28 2925
B/S架构大家应该都不陌生，web1.0时代，用户通过个人电脑浏览网站，单项获取信息，比如我们浏览新闻，查阅资料等。web2.0很快就到来，和1.0相比，用户可以随时随地分享自己的信息。这个时候就涉及到了我们的身份认证。当我们使用http无状态请求访问资源服务的时候，服务端是如何知道我们的身份的，我们今天就来聊一聊。💬💬💬💬💬💬。
springboot JWT Token 自动续期的解决方案
weixin_39255905的博客
03-25 5729
关于JWT Token 自动续期的解决方案 前言 在前后端分离的开发模式下，前端用户登录成功后后端服务会给用户颁发一个jwt token。前端(如vue)在接收到jwt token后会将token存储到LocalStorage中。 后续每次请求都会将此token放在请求头中传递到后端服务，后端服务会有一个过滤器对token进行拦截校验，校验token是否过期，如果token过期则会让前端跳转到登录页面重新登录。 因为jwt token中一般会包含用户的基本信息，为了保证token的安全性，一般.
SpringBoot 实现 JWT token 自动续期
weixin_44421461的博客
01-18 2597
点击上方“Java基基”，选择“设为星标”做积极的人，而不是积极废人！每天14:00更新文章，每天掉亿点点头发...源码精品专栏原创 | Java 2021超神之路，很肝~中文详细注释的开源项目RPC 框架 Dubbo 源码解析网络应用框架 Netty 源码解析消息中间件 RocketMQ 源码解析数据库中间件 Sharding-JDBC 和 MyCAT 源码解析作业调度中间件 Elast...
JWT认证与Token自动续期的最佳实践
资源摘要信息:"JWT实现登录认证与Token自动续期方案详细解析" 一、JWT基础概念及登录认证原理 1. JWT（JSON Web Token）是一个开放标准（RFC 7519），它定义了一种简洁的、自包含的方式用于通信双方之间以JSON对象...
关于 JWT Token 自动续期的解决（根据其他文献参考写的）
qq_40095187的博客
04-22 1413
关于 JWT Token 自动续期的解决 关于 JWT Token 自动续期的解决方案 在前后端分离的开发模式下，前端用户登录成功后后端服务会给用户颁发一个 jwt token。前端(如 vue)在接收到 jwt token 后会将 token 存储到 LocalStorage 中。 后续每次请求都会将此 token 放在请求头中传递到后端服务，后端服务会有一个过滤器对 token 进行拦截校验，校验 token 是否过期，如果 token 过期则会让前端跳转到登录页面重新登录。 因为 jwt token
Token续期方案详解及Java实现
本文围绕“Token续期方案详解[源码]”这一主题，系统性地剖析了三种主流的Token续期机制：单Token方案、双Token方案以及基于缓存的Token续期方案，并结合Java语言实现示例进行详细说明。 首先，**单Token方案**是一...
【紧急通知】token即将过期？通过代码分析自动续期的实现
产品经理克星（狗头）
10-26 1047
token自动续期方式token定时检查续期方便实现，只需后端更改即可存在未及时续期情况双token验证效率更高，适用的特殊情况更多需要前后端协调更改我是小白，记录日常的小白，欢迎大佬们指点。
token自动续期方案
玉兰花秀丽
03-29 6750
该方法的好处：只需N（token的有效时间）分钟续期一次token就行，避免频繁续期 一、原理 登录生成token，有效期10分钟。 将token存入redis，key与value皆为token，有效期20分钟 token返回给前端 前端携带token访问后端，后端先从redis获取token 如果redis有token,则校验token是否到期 没有到期返回ture 到期了，则重新根据账户信息生成token信息，并将token放入redis当 中（注意redis的key不改变），有效期20分钟
AAA token 过期后，如何自动续期？
很多时候犯错都是在不知情的情况下发生的
05-24 980
如果经常需要用户重新登录，显然这种体验不是太好，因此很多应用会采用token过期后自动续期的方案，只有特定条件下才会让用户重新登录。首先我们看一个单token方案，这个方案除了可以实现token续期以外，还可以实现某些条件下的强制重新登录。JWT token的 payload 部分是一个json串，是要传递数据的一组声明，这些声明被JWT标准称为claims。另外后端还可以记录刷新token的次数，比如最多刷新50次，如果达到50次，则不再允许刷新，需要用户重新授权。代码语言：javascript。
token 过期后，如何自动续期？
好好学java
06-14 486
今日推荐减少 try-catch ，这样做才叫优雅！ 让人上瘾的新一代开发神器，彻底告别Controller、Service、Dao等方法 SpringBoot实现人脸识别功能 相信我，使用 Stream 真的可以让代码更优雅！ 全网最详细的线程池 ThreadPoolExecutor 解读！ 利用多线程批量拆分 List 导入数据库，效率杠杠的！JWT tok...
每天一小步-JWT Token自动续期
qq_53924122的博客
07-24 1716
实现JWT（JSONWeb Tokens）生成Token的自动续期
【SpringBoot】JWT+Token之Token自动续期
低调做人，低调编码，神码都是浮云
05-31 1975
Springboot+jwt+token实现双token认证
双Token方案实现Token自动续期（基于springboot+vue前后端分离项目）
qq_44286009的博客
06-10 5089
jwt理论介绍springboot+vue项目中使用jwt实现登录认证本篇文章的代码是在springboot+vue项目中使用jwt实现登录认证的基础上实现的Token自动续期的功能。双token解决方案是一种用于增强用户登录安全性和提升用户体验的认证机制。它主要涉及两个令牌：访问令牌（accessToken）和刷新令牌（refreshToken）。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值