天天看点

前后端分离,使用websocket刷新token

之前提到过刷新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连接:

前后端分离,使用websocket刷新token

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发生了错误")
            }
        }
    }
           

继续阅读