之前提到过刷新token的思路:关于刷新token的几点思考
现在,springBoot + vue的项目中,使用websocket刷新token,来解决token过期后如何刷新的问题。
思路也很简单,就是在出现token解析出现过期异常时,捕获它,重新生成token,一般会设置一个时间限制,不然没有意义。
后端主要代码:
boolean validateToken(String authToken,String username){
try {
Jwts.parser().setSigningKey(key).parseClaimsJws(authToken);
return true;
} catch (io.jsonwebtoken.security.SecurityException | MalformedJwtException e) {
logger.info("Invalid JWT signature.");
e.printStackTrace();
} catch (ExpiredJwtException e) {
logger.info("Expired JWT token.");
if (canRefreshToken()){
// 在规定的过期时间内,可以刷新token
String refreshToken = refreshTokenUtil.refreshToken(username, UserInfoUtil.getPasswordByUsername(username));
logger.info("刷新token: "+refreshToken);
try {
WebSocketServer.sendInfo(securityProperties.getTokenStartWith() + refreshToken,UserInfoUtil.getUserIdByUsername(username));
}catch (IOException e1){
logger.info("推送刷新token失败");
}
}else {
logger.info("token过期超过了 {} 分钟,无法刷新",refreshInterval/1000/60);
e.printStackTrace();
}
} catch (UnsupportedJwtException e) {
logger.info("Unsupported JWT token.");
e.printStackTrace();
} catch (IllegalArgumentException e) {
logger.info("JWT token compact of handler are invalid.");
e.printStackTrace();
}
return false;
}
后端在规定时间内,可以返回刷新的token,前端通过websocket接受
前端在登录成功之后,进行websocket连接:
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLiAzNfRHLGZkRGZkRfJ3bs92YsYTMfVmepNHL6lEVNhmWtJGcohFZwZ0MMBjVtJWd0ckW65UbM5WOHJWa5kHT20ESjBjUIF2X0hXZ0xCMx81dvRWYoNHLrdEZwZ1Rh5WNXp1bwNjW1ZUba9VZwlHdssmch1mclRXY39CXldWYtlWPzNXZj9mcw1ycz9WL49zZuBnL4AjNxIDNzMjMxAjNwAjMwIzLc52YucWbp5GZzNmLn9Gbi1yZtl2Lc9CX6MHc0RHaiojIsJye.png)
openSocket代码:
//开启连接
export function openSocket(userId) {
if(typeof(WebSocket) == "undefined") {
console.log("您的浏览器不支持WebSocket");
}else{
console.log("您的浏览器支持WebSocket");
var socketUrl="ws://localhost:8888/ws/"+getUserId()
// socketUrl=socketUrl.replace("https","ws").replace("http","ws")
console.log(socketUrl);
if(socket!=null){
socket.close()
socket=null
}
socket = new WebSocket(socketUrl)
//打开事件
socket.onopen = function() {
console.log("websocket:已建立连接")
};
//获得消息事件
socket.onmessage = function(msg) {
//console.log("收到消息:" + msg.data)
store.commit('user/SET_TOKEN',msg.data)
setToken(msg.data)
};
//关闭事件
socket.onclose = function() {
console.log("websocket已关闭")
};
//发生了错误事件
socket.onerror = function() {
console.log("websocket发生了错误")
}
}
}