springboot+vue3无感知刷新token实战

一、java后端

1、token构造实现类

①验证码方式实现类

②刷新token方式实现类

2、token相关操作：setCookie

①createToken

②refreshToken

二、前端（vue3+axios）

web网站中，前后端交互时，通常使用token机制来做认证，token一般会设置有效期，当token过了有效期后，用户需要重新登录授权获取新的token，但是某些业务场景下，用户不希望频繁的进行登录授权，但是安全考虑，token的有效期不能设置太长时间，所以有了刷新token的设计，无感知刷新token的机制更进一步优化了用户体验，本文是博主实际业务项目中基于springboot和vue3无感知刷新token的代码实战。

首先介绍无感知刷新token的实现思路：

①首次授权颁发token时，我们通过后端给前端请求response中写入两种cookie

- access_token

- refresh_token（超时时间比access_token长一些）

需要注意：

-后端setCookie时httpOnly=true（限制cookie只能被http请求携带使用，不能被js操作）

-前端axios请求参数withCredentials=true（http请求时，自动携带token）

②access_token失效时，抛出特殊异常，前后端约定http响应码（401），此时触发刷新token逻辑

③前段http请求钩子中，如果出现http响应码为401时，立即触发刷新token逻辑，同时缓存后续请求，刷新token结束后，依次续发缓存中的请求

一、java后端

后端java框架使用springboot，spring-security

登录接口：

/*** @author lichenhao* @date 2023/2/8 17:41*/
@RestController
public class AuthController {/*** 登录方法** @param loginBody 登录信息* @return 结果*/@PostMapping("/oauth")public AjaxResult login(@RequestBody LoginBody loginBody) {ITokenGranter granter = TokenGranterBuilder.getGranter(loginBody.getGrantType());return granter.grant(loginBody);}
}import lombok.Data;/*** 用户登录对象** @author lichenhao*/
@Data
public class LoginBody {/*** 用户名*/private String username;/*** 用户密码*/private String password;/*** 验证码*/private String code;/*** 唯一标识*/private String uuid;/** grantType 授权类型* */private String grantType;/** 是否直接强退该账号登陆的其他客户端* */private Boolean forceLogoutFlag;
}

token构造接口类和token实现类构造器如下：

/*** @author lichenhao* @date 2023/2/8 17:29* <p>* 获取token*/
public interface ITokenGranter {AjaxResult grant(LoginBody loginBody);
}/*** @author lichenhao* @date 2023/2/8 17:29*/
@AllArgsConstructor
public class TokenGranterBuilder {/*** TokenGranter缓存池*/private static final Map<String, ITokenGranter> GRANTER_POOL = new ConcurrentHashMap<>();static {GRANTER_POOL.put(CaptchaTokenGranter.GRANT_TYPE, SpringUtils.getBean(CaptchaTokenGranter.class));GRANTER_POOL.put(RefreshTokenGranter.GRANT_TYPE, SpringUtils.getBean(RefreshTokenGranter.class));}/*** 获取TokenGranter** @param grantType 授权类型* @return ITokenGranter*/public static ITokenGranter getGranter(String grantType) {ITokenGranter tokenGranter = GRANTER_POOL.get(StringUtils.toStr(grantType, PasswordTokenGranter.GRANT_TYPE));if (tokenGranter == null) {throw new ServiceException("no grantType was found");} else {return tokenGranter;}}}

这里通过LoginBody的grantType属性，指定实际的token构造实现类；同时，需要有token

本文我们用到了验证码方式和刷新token方式，如下