VUE+SpringBoot+JWT实现token验证，SSO单点登录

淡淡的烟草味﹌ 2023-06-12 09:58 5阅读 0赞

## ##

### **Session的产生：** ###

在说session是啥之前，我们先来说说为什么会出现session会话，它出现的机理是什么？我们知道，我们用浏览器打开一个网页，用到的是HTTP协议，htpp协议是无状态的，什么是无状态呢？就是说这一次请求和上一次请求是没有任何关系的，互不认识的，没有关联的，这种无状态的好处是快速。

所以就会带来一个问题就是，我希望几个请求的页面要有关联，比如：我在www.a.com/login.html里面登陆了，我在www.a.com/index.html 也希望是登陆状态，但是，这是2个不同的页面，也就是2个不同的HTTP请求，这2个HTTP请求是无状态的，也就是无关联的，所以无法单纯的在index.html中读取到它在login.html中已经登陆了！

那咋搞呢？我不可能这2个页面我都去登陆一遍吧。

（1）用笨方法这2个页面都去查询数据库，如果有登陆状态，就判断是登陆的了。这种查询数据库的方案虽然可行，但是每次都要去查询数据库不是个事，会造成数据库的压力。

（2）所以正是这种诉求，这个时候，一个新的客户端存储数据方式出现了：cookie。cookie是把少量的信息存储在用户自己的电脑上，它在一个域名下是一个全局的，只要设置它的存储路径在域名www.a.com下 ，那么当用户用浏览器访问时，前端js就可以从这个域名的任意页面读取cookie中的信息。所以就很好的解决了我在www.a.com/login.html页面登陆了，我也可以在www.a.com/index.html获取到这个登陆信息了。同时又不用反复去查询数据库。

虽然这种方案很不错，也很快速方便，但是由于cookie 是存在用户端，而且它本身存储的尺寸大小也有限，最关键是用户可以是可见的，并可以随意的修改，很不安全。那如何又要安全，又可以方便的全局读取信息呢？于是，这个时候，一种新的存储会话机制：session 诞生了。

（3）从上面的描述来讲，它就是在一次会话中解决2次HTTP的请求的关联，让它们产生联系，让2两个页面都能读取到找个这个全局的session信息。session信息存在于服务器端，所以也就很好的解决了安全问题。

**Springboot+Vue[集成JWT实现token验证][JWT_token]**

（1）Json web token (JWT), 是为了在网络应用环境间传递声明而执行的一种基于`JSON`的开放标准（(RFC 7519).定义了一种简洁的，自包含的方法用于通信双方之间以`JSON`对象的形式安全的传递信息。因为数字签名的存在，这些信息是可信的，JWT可以使用`HMAC`算法或者是`RSA`的公私秘钥对进行签名。

![format_png][]

1. 用户使用账号和面发出post请求；  
2. 服务器使用私钥创建一个jwt；  
3. 服务器返回这个jwt给浏览器；  
4. 浏览器将该jwt串在请求头中像服务器发送请求；  
5. 服务器验证该jwt；  
6. 返回响应的资源给浏览器。

**jwt的主要应用场景**

身份认证在这种场景下，一旦用户完成了登陆，在接下来的每个请求中包含JWT，可以用来验证用户身份以及对路由，服务和资源的访问权限进行验证。由于它的开销非常小，可以轻松的在不同域名的系统中传递，所有目前在单点登录（SSO）中比较广泛的使用了该技术。 信息交换在通信的双方之间使用JWT对数据进行编码是一种非常安全的方式，由于它的信息是经过签名的，可以确保发送者发送的信息是没有经过伪造的。

**优点**

1.简洁(Compact): 可以通过`URL`，`POST`参数或者在`HTTP header`发送，因为数据量小，传输速度也很快  
2.自包含(Self-contained)：负载中包含了所有用户所需要的信息，避免了多次查询数据库  
3.因为`Token`是以`JSON`加密的形式保存在客户端的，所以`JWT`是跨语言的，原则上任何web形式都支持。  
4.不需要在服务端保存会话信息，特别适用于分布式微服务。

**JWT的结构**

JWT是由三段信息构成的，将这三段信息文本用.链接一起就构成了JWT字符串。  
就像这样:  
`eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6IkpvaG4gRG9lIiwiYWRtaW4iOnRydWV9.TJVA95OrM7E2cBab30RMHrHDcEfxjoYZgeFONFh7HgQ`

JWT包含了三部分：  
Header 头部(标题包含了令牌的元数据，并且包含签名和/或加密算法的类型)  
Payload 负载 (类似于飞机上承载的物品)  
Signature 签名/签证

Header

JWT的头部承载两部分信息：token类型和采用的加密算法。

{ 
      "alg": "HS256",
       "typ": "JWT"
    }

声明类型:这里是jwt  
声明加密的算法:通常直接使用 HMAC SHA256

加密算法是单向函数散列算法，常见的有MD5、SHA、HAMC。  
MD5(message-digest algorithm 5) （信息-摘要算法）缩写，广泛用于加密和解密技术，常用于文件校验。校验？不管文件多大，经过MD5后都能生成唯一的MD5值  
SHA (Secure Hash Algorithm，安全散列算法），数字签名等密码学应用中重要的工具，安全性高于MD5  
HMAC (Hash Message Authentication Code)，散列消息鉴别码，基于密钥的Hash算法的认证协议。用公开函数和密钥产生一个固定长度的值作为认证标识，用这个标识鉴别消息的完整性。常用于接口签名验证

Payload

载荷就是存放有效信息的地方。  
有效信息包含三个部分  
1.标准中注册的声明  
2.公共的声明  
3.私有的声明

标准中注册的声明 (建议但不强制使用) ：

`iss`: jwt签发者  
`sub`: 面向的用户(jwt所面向的用户)  
`aud`: 接收jwt的一方  
`exp`: 过期时间戳(jwt的过期时间，这个过期时间必须要大于签发时间)  
`nbf`: 定义在什么时间之前，该jwt都是不可用的.  
`iat`: jwt的签发时间  
`jti`: jwt的唯一身份标识，主要用来作为一次性`token`,从而回避重放攻击。

公共的声明 ：

公共的声明可以添加任何的信息，一般添加用户的相关信息或其他业务需要的必要信息.但不建议添加敏感信息，因为该部分在客户端可解密.

私有的声明 ：

私有声明是提供者和消费者所共同定义的声明，一般不建议存放敏感信息，因为`base64`是对称解密的，意味着该部分信息可以归类为明文信息。

Signature

jwt的第三部分是一个签证信息，这个签证信息由三部分组成：  
header (base64后的)  
payload (base64后的)  
secret  
这个部分需要`base64`加密后的`header`和`base64`加密后的`payload`使用`.`连接组成的字符串，然后通过`header`中声明的加密方式进行加盐`secret`组合加密，然后就构成了`jwt`的第三部分。  
密钥`secret`是保存在服务端的，服务端会根据这个密钥进行生成`token`和进行验证，所以需要保护好。

**VUE+JWT**

在请求拦截器中配置请求头中携带token

// request interceptor
    service.interceptors.request.use(
      config => {
        config.url += '?date=' + new Date().getTime()
        // 如果是登录和注册的请求，就不需要加JWT
        if (config.url.indexOf("login") == -1 && config.url.indexOf("register") == -1) {
          const JWT = sessionStorage.getItem("EPDP_session");
          config.headers['token'] = JWT
        }
        return config
      },
      error => {
        // do something with request error
        console.log(error) // for debug
        return Promise.reject(error)
      }
    )

**Springboot+JWT**

（1）引入`JWT`依赖,由于是基于`Java`，所以需要的是`java-jwt`

（2）编写两个注解

用来跳过验证的`PassToken`

@Target({ElementType.METHOD, ElementType.TYPE})
    @Retention(RetentionPolicy.RUNTIME)
    public @interface PassToken {
        boolean required() default true;
    }

需要登录才能进行操作的注解`UserLoginToken`

@Target({ElementType.METHOD, ElementType.TYPE})
    @Retention(RetentionPolicy.RUNTIME)
    public @interface UserLoginToken {
        boolean required() default true;
    }

（3）简单定义三个controller

@PassToken
        @RequestMapping("/register")
        public Map<String, Object> Register(String usrname, String password1, String password2) throws IOException {
            Map<String, Object> map = new HashMap<>();
            String message = "注册成功";
            //密码不一致
            if (!password1.equals(password2)) {
                message = "密码不一致";
                map = new HashMap<>();
                map.put("message", message);
                return map;
            }
            HBaseUsr hBaseUsr = new HBaseUsr();
            Usr usr = hBaseUsr.SelectFromTable(usrname);
            //账户名已存在
            if (usr.getUsrname().equals(usrname)) {
                message = "账户名已存在";
                map = new HashMap<>();
                map.put("message", message);
                return map;
            }
            try {
                //初始化项目信息表others:projects，将用户插入到项目信息表
                projectService.initUsrProject(usrname);
                //建立用户模型历史记录表usr_history:usrname
                modelHistoryService.initUsrHistory(usrname);
                //建立用户模型表usr_model:usrname
                HBaseModel hBaseModel = new HBaseModel(usrname);
                hBaseModel.CreateUsrModelTable();
                //建立用户模型任务表usr_task:usrname
                modelTaskService.initModelTask(usrname);
            } catch (Exception e) {
                e.printStackTrace();
                throw new MyException("20000","用户信息添加失败，请稍后重试","/usr/register");
            }
            //插入hBaseUsr表
            usr.setUsrname(usrname);
            usr.setPassword(password1);
            hBaseUsr.InsertToTable(usr);
    
            message = "success";
            map = new HashMap<>();
            map.put("message", message);
            return map;
        }
    
        @PassToken
        @RequestMapping("/login")
        public ResultBean Login(String usrname, String password) throws Exception {
    
            String password_desEncrypt = AES_encryption.desEncrypt(new String(password.getBytes(), "UTF-8")).trim();
            Map<String, Object> map = new HashMap<>();
            try {
                HBaseUsr hBaseUsr = new HBaseUsr();
                Usr usr = hBaseUsr.SelectFromTable(usrname);
                //账户名不存在
                if (!usr.getUsrname().equals(usrname)) {
                    return ResultBean.failed("账户名不存在");
                }
                //密码不一致
                else if (!usr.getPassword().equals(password_desEncrypt)) {
    //            else if (!usr.getPassword().equals(password)) {
                    return ResultBean.failed("密码不一致");
                }else {
                    //登陆成功
                    map = new HashMap<>();
                    String token = tokenService.getToken(usr);
                    map.put("token", token);
                }
    
            } catch (IOException e) {
                e.printStackTrace();
            }
            return ResultBean.success(map);
        }
    
        @UsrLoginToken
        @GetMapping("/showInfo")
        public Map<String, Object> ShowInfo(String usrname) {
            Map<String, Object> map = new HashMap<>();
            try {
                HBaseUsr hBaseUsr = new HBaseUsr();
                Usr usr = hBaseUsr.SelectFromTable(usrname);
                map = new HashMap<>();
                map.put("data", usr);
            } catch (IOException e) {
                e.printStackTrace();
            }
            return map;
        }

（4）配置拦截器去拦截token并获取token

拦截器配置

package springapplication.interceptor;
    
    import org.springframework.context.annotation.Bean;
    import org.springframework.context.annotation.Configuration;
    import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
    import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
    
    /**
     * @author fourier
     * @date 2018-07-08 22:33
     */
    @Configuration
    public class InterceptorConfig implements WebMvcConfigurer {
        @Override
        public void addInterceptors(InterceptorRegistry registry) {
            registry.addInterceptor(authenticationInterceptor())
                    .addPathPatterns("/**");    // 拦截所有请求，通过判断是否有 @LoginRequired 注解 决定是否需要登录
        }
        @Bean
        public AuthenticationInterceptor authenticationInterceptor() {
            return new AuthenticationInterceptor();
        }
    }

从请求头中获取token并处理

package springapplication.interceptor;
    
    import com.auth0.jwt.JWT;
    import com.auth0.jwt.JWTVerifier;
    import com.auth0.jwt.algorithms.Algorithm;
    import com.auth0.jwt.exceptions.JWTDecodeException;
    import com.auth0.jwt.exceptions.JWTVerificationException;
    import org.springframework.web.method.HandlerMethod;
    import org.springframework.web.servlet.HandlerInterceptor;
    import org.springframework.web.servlet.ModelAndView;
    import springapplication.annotation.PassToken;
    import springapplication.annotation.UsrLoginToken;
    import springapplication.exception.MyException;
    import springapplication.hdfscore.HBaseUsr;
    import springapplication.pojo.Usr;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.lang.reflect.Method;
    
    /**
     * @author fourier
     * @date 2018-07-08 20:41
     */
    public class AuthenticationInterceptor implements HandlerInterceptor {
    
        @Override
        public boolean preHandle(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object object) throws Exception {
            String token = httpServletRequest.getHeader("token");// 从 http 请求头中取出 token
            // 如果不是映射到方法直接通过
            if(!(object instanceof HandlerMethod)){
                return true;
            }
            HandlerMethod handlerMethod=(HandlerMethod)object;
            Method method=handlerMethod.getMethod();
            //检查是否有passtoken注释，有则跳过认证
            if (method.isAnnotationPresent(PassToken.class)) {
                PassToken passToken = method.getAnnotation(PassToken.class);
                if (passToken.required()) {
                    return true;
                }
            }
            //检查有没有需要用户权限的注解
            if (method.isAnnotationPresent(UsrLoginToken.class)) {
                UsrLoginToken userLoginToken = method.getAnnotation(UsrLoginToken.class);
                if (userLoginToken.required()) {
                    // 执行认证
                    if (token == null) {
                        throw new MyException("50000","无token，请重新登录","AuthenticationInterceptor");
                    }
                    // 获取 token 中的 usrname
                    String usrname;
                    try {
                        usrname = JWT.decode(token).getAudience().get(0);
                    } catch (JWTDecodeException j) {
                        throw new MyException("50000","token错误，请重新登录","AuthenticationInterceptor");
                    }
                    HBaseUsr hBaseUsr = new HBaseUsr();
                    Usr usr = hBaseUsr.SelectFromTable(usrname);
                    if (usr == null) {
                        throw new MyException("50000","用户不存在，请重新登录","AuthenticationInterceptor");
                    }
                    // 验证 token
                    JWTVerifier jwtVerifier = JWT.require(Algorithm.HMAC256(usr.getPassword())).build();
                    try {
                        jwtVerifier.verify(token);
                    } catch (JWTVerificationException e) {
                        throw new MyException("50000","token错误，请重新登录","AuthenticationInterceptor");
                    }
                    return true;
                }
            }
            return true;
        }
    
        @Override
        public void postHandle(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object o, ModelAndView modelAndView) throws Exception {
    
        }
        @Override
        public void afterCompletion(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, Object o, Exception e) throws Exception {
    
        }
    }

测试的话推荐使用Postman

[JWT_token]: https://www.cnblogs.com/shihaiming/p/9565835.html
[format_png]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy80NjMwMjk1LTdkZjBkMTBmY2ZmZTgzMWIucG5n?x-oss-process=image/format,png