AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

jwt的使用概念工具类与切入spa项目

2023-11-09 71
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： jwt的使用概念工具类与切入spa项目

jwt的概念

JWT（JSON Web Token）是一种用于身份验证和授权的开放标准，它是一种轻量级的、安全的、基于JSON的令牌机制。

JWT由三部分组成：头部（Header）、载荷（Payload）和签名（Signature）。头部包含了令牌类型及使用的加密算法；载荷包含了声明的信息，例如用户ID、姓名等；签名则对头部和载荷进行了签名，以确保令牌的完整性和安全性。


JWT最常见的使用场景就是在前端应用中进行身份验证和授权。当用户在前端应用中登录后，后端服务器会生成一个JWT令牌并返回给前端应用。之后，前端应用在每次请求时都会携带这个令牌，后端服务器通过验证JWT的签名及有效期，来确定该用户的身份和访问权限。


相比于传统的session和cookie方式，JWT可以减少对服务器的请求，从而提高系统的性能和可伸缩性；同时也能够跨域传输，适用于分布式系统的接口调用；而且JWT令牌的签名同时也保证了数据的完整性和安全性，防止了数据篡改和伪造。因此，JWT在现代Web应用中得到了广泛的应用。

前台token令牌管理机制

前台token令牌管理机制主要用于用户认证和授权。其作用如下：

  1. 用户认证：当用户登录系统时，前台会生成一个token令牌，然后将该令牌返回给客户端，以便客户端在后续操作中进行验证。
  2. 授权管理：前台可以根据token令牌的权限级别进行访问控制，以确保用户只能访问其具备权限的资源。
  3. 提高安全性：通过token令牌管理机制，可以有效减少对用户密码的依赖和存储，提高了系统的安全性。
  4. 降低服务器压力：由于token令牌可以有效减少多次验证的重复操作，从而降低了对服务器的负载压力。

综上所述，前台token令牌管理机制提高了系统安全性，降低了服务器压力，提高了用户体验。

jwt工具类

JwtUtils
package com.zking.ssm.jwt;
import java.util.Date;
import java.util.Map;
import java.util.UUID;
import javax.crypto.SecretKey;
import javax.crypto.spec.SecretKeySpec;
import org.apache.commons.codec.binary.Base64;
import io.jsonwebtoken.Claims;
import io.jsonwebtoken.JwtBuilder;
import io.jsonwebtoken.Jwts;
import io.jsonwebtoken.SignatureAlgorithm;
/**
 * JWT验证过滤器：配置顺序 CorsFilte->JwtUtilsr-->StrutsPrepareAndExecuteFilter
 *
 */
public class JwtUtils {
  /**
   * JWT_WEB_TTL：WEBAPP应用中token的有效时间,默认30分钟
   */
  public static final long JWT_WEB_TTL = 30 * 60 * 1000;
  /**
   * 将jwt令牌保存到header中的key
   */
  public static final String JWT_HEADER_KEY = "jwt";
  // 指定签名的时候使用的签名算法，也就是header那部分，jwt已经将这部分内容封装好了。
  private static final SignatureAlgorithm SIGNATURE_ALGORITHM = SignatureAlgorithm.HS256;
  private static final String JWT_SECRET = "f356cdce935c42328ad2001d7e9552a3";// JWT密匙
  private static final SecretKey JWT_KEY;// 使用JWT密匙生成的加密key
  static {
    byte[] encodedKey = Base64.decodeBase64(JWT_SECRET);
    JWT_KEY = new SecretKeySpec(encodedKey, 0, encodedKey.length, "AES");
  }
  private JwtUtils() {
  }
  /**
   * 解密jwt，获得所有声明(包括标准和私有声明)
   * 
   * @param jwt
   * @return
   * @throws Exception
   */
  public static Claims parseJwt(String jwt) {
    Claims claims = Jwts.parser()
        .setSigningKey(JWT_KEY)
        .parseClaimsJws(jwt)
        .getBody();
    return claims;
  }
  /**
   * 创建JWT令牌，签发时间为当前时间
   * 
   * @param claims
   *            创建payload的私有声明（根据特定的业务需要添加，如果要拿这个做验证，一般是需要和jwt的接收方提前沟通好验证方式的）
   * @param ttlMillis
   *            JWT的有效时间(单位毫秒)，当前时间+有效时间=过期时间
   * @return jwt令牌
   */
  public static String createJwt(Map<String, Object> claims, 
      long ttlMillis) {
    // 生成JWT的时间，即签发时间 2021-10-30 10:02:00 -> 30 10:32:00
    long nowMillis = System.currentTimeMillis();
    //链式语法：
    // 下面就是在为payload添加各种标准声明和私有声明了
    // 这里其实就是new一个JwtBuilder，设置jwt的body
    JwtBuilder builder = Jwts.builder()
        // 如果有私有声明，一定要先设置这个自己创建的私有的声明，这个是给builder的claim赋值，一旦写在标准的声明赋值之后，就是覆盖了那些标准的声明的
        .setClaims(claims)
        // 设置jti(JWT ID)：是JWT的唯一标识，根据业务需要，这个可以设置为一个不重复的值，主要用来作为一次性token,从而回避重放攻击。
        // 可以在未登陆前作为身份标识使用
        .setId(UUID.randomUUID().toString().replace("-", ""))
        // iss(Issuser)签发者，写死
        .setIssuer("zking")
        // iat: jwt的签发时间
        .setIssuedAt(new Date(nowMillis))
        // 代表这个JWT的主体，即它的所有人，这个是一个json格式的字符串，可放数据{"uid":"zs"}。此处没放
        // .setSubject("{}")
        // 设置签名使用的签名算法和签名使用的秘钥
        .signWith(SIGNATURE_ALGORITHM, JWT_KEY)
        // 设置JWT的过期时间
        .setExpiration(new Date(nowMillis + ttlMillis));
    return builder.compact();
  }
  /**
   * 复制jwt，并重新设置签发时间(为当前时间)和失效时间
   * 
   * @param jwt
   *            被复制的jwt令牌
   * @param ttlMillis
   *            jwt的有效时间(单位毫秒)，当前时间+有效时间=过期时间
   * @return
   */
  public static String copyJwt(String jwt, Long ttlMillis) {
    //解密JWT，获取所有的声明（私有和标准）
    //old
    Claims claims = parseJwt(jwt);
    // 生成JWT的时间，即签发时间
    long nowMillis = System.currentTimeMillis();
    // 下面就是在为payload添加各种标准声明和私有声明了
    // 这里其实就是new一个JwtBuilder，设置jwt的body
    JwtBuilder builder = Jwts.builder()
        // 如果有私有声明，一定要先设置这个自己创建的私有的声明，这个是给builder的claim赋值，一旦写在标准的声明赋值之后，就是覆盖了那些标准的声明的
        .setClaims(claims)
        // 设置jti(JWT ID)：是JWT的唯一标识，根据业务需要，这个可以设置为一个不重复的值，主要用来作为一次性token,从而回避重放攻击。
        // 可以在未登陆前作为身份标识使用
        //.setId(UUID.randomUUID().toString().replace("-", ""))
        // iss(Issuser)签发者，写死
        // .setIssuer("zking")
        // iat: jwt的签发时间
        .setIssuedAt(new Date(nowMillis))
        // 代表这个JWT的主体，即它的所有人，这个是一个json格式的字符串，可放数据{"uid":"zs"}。此处没放
        // .setSubject("{}")
        // 设置签名使用的签名算法和签名使用的秘钥
        .signWith(SIGNATURE_ALGORITHM, JWT_KEY)
        // 设置JWT的过期时间
        .setExpiration(new Date(nowMillis + ttlMillis));
    return builder.compact();
  }
}
JwtDemo

如果要使用的话一定要更改下面代码中的密钥

package com.zking.ssm.service.impl;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;
import com.zking.ssm.jwt.JwtUtils;
import io.jsonwebtoken.Claims;
import org.junit.*;
public class JwtDemo {
  private SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss.SSS");
  @Test
  public void test1() {// 生成JWT
    //JWT Token=Header.Payload.Signature
    //头部.载荷.签名
    //Payload=标准声明+私有声明+公有声明
    //定义私有声明
    Map<String, Object> claims = new HashMap<String, Object>();
    claims.put("username", "zss");
    claims.put("age", 18);
      //TTL:Time To Live
    String jwt = JwtUtils.createJwt(claims, JwtUtils.JWT_WEB_TTL);
    System.out.println(jwt);
    //获取Payload（包含标准和私有声明）
    Claims parseJwt = JwtUtils.parseJwt(jwt);
    for (Map.Entry<String, Object> entry : parseJwt.entrySet()) {
      System.out.println(entry.getKey() + "=" + entry.getValue());
    }
    Date d1 = parseJwt.getIssuedAt();
    Date d2 = parseJwt.getExpiration();
    System.out.println("令牌签发时间：" + sdf.format(d1));
    System.out.println("令牌过期时间：" + sdf.format(d2));
  }
  @Test
  public void test2() {// 解析oldJwt
    //io.jsonwebtoken.ExpiredJwtException：JWT过期异常
    //io.jsonwebtoken.SignatureException：签名异常
    //String oldJwt="eyJhbGciOiJIUzI1NiJ9.eyJleHAiOjE1OTA3MTg2NzcsImlhdCI6MTU5MDcxNjg3NywiYWdlIjoxOCwianRpIjoiNDFmZjFiZGFkYzkxNDA3OGE4ZGUyNGRkZDEwYjU4N2IiLCJ1c2VybmFtZSI6InpzcyJ9.DdPvioX6kuhV6lEfD9QAN2eQSk_mO3dYkmDmTQsqa78";
    //eyJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MzU1NjE3MjcsImlhdCI6MTYzNTU1OTkyNywiYWdlIjoxOCwianRpIjoiN2RlYmIzM2JiZTg3NDBmODgzNDI5Njk0ZWE4NzcyMTgiLCJ1c2VybmFtZSI6InpzcyJ9.dUR-9JUlyRdoYx-506SxXQ3gbHFCv0g5Zm8ZGzK1fzw
    String newJwt="eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJ6a2luZyIsImV4cCI6MTY5NzIxMjI2NSwiaWF0IjoxNjk3MjEwNDY1LCJhZ2UiOjE4LCJqdGkiOiJlYTg3NzcwNDFiMjM0YzIxOGY0YjRlZjA5OTBmMDZiYyIsInVzZXJuYW1lIjoienNzIn0.-elzXkiMatkbV2e-CFUL4GV9-SSGSnIwgUNpHOdoN-0";
    String oldJwt = "eyJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MzU1NjE3MjcsImlhdCI6MTYzNTU1OTkyNywiYWdlIjoxOCwianRpIjoiN2RlYmIzM2JiZTg3NDBmODgzNDI5Njk0ZWE4NzcyMTgiLCJ1c2VybmFtZSI6InpzcyJ9.dUR-9JUlyRdoYx-506SxXQ3gbHFCv0g5Zm8ZGzK1fzw";
    Claims parseJwt = JwtUtils.parseJwt(newJwt);
    for (Map.Entry<String, Object> entry : parseJwt.entrySet()) {
      System.out.println(entry.getKey() + "=" + entry.getValue());
    }
    Date d1 = parseJwt.getIssuedAt();
    Date d2 = parseJwt.getExpiration();
    System.out.println("令牌签发时间：" + sdf.format(d1));
    System.out.println("令牌过期时间：" + sdf.format(d2));
  }
  @Test
  public void test3() {// 复制jwt，并延时30分钟
    String oldJwt = "eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJ6a2luZyIsImV4cCI6MTY5NzIxMjI2NSwiaWF0IjoxNjk3MjEwNDY1LCJhZ2UiOjE4LCJqdGkiOiJlYTg3NzcwNDFiMjM0YzIxOGY0YjRlZjA5OTBmMDZiYyIsInVzZXJuYW1lIjoienNzIn0.-elzXkiMatkbV2e-CFUL4GV9-SSGSnIwgUNpHOdoN-0";
    //String newJwt = "eyJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MDU3NTM2NTUsImlhdCI6MTYwNTc1MTg1NSwiYWdlIjoxOCwianRpIjoiYmNmN2Q1MzQ2YjE3NGU2MDk1MmIxYzQ3ZTlmMzQyZjgiLCJ1c2VybmFtZSI6InpzcyJ9.m1Qn84RxgbKCnsvrdbbAnj8l_5Jwovry8En0j4kCxhc";
    //String oldJwt = "eyJhbGciOiJIUzI1NiJ9.eyJleHAiOjE1NjI5MDMzNjAsImlhdCI6MTU2MjkwMTU2MCwiYWdlIjoxOCwianRpIjoiZDVjMzE4Njg0MDcyNDgyZDg1MDE5ODVmMDY3OGQ4NjkiLCJ1c2VybmFtZSI6InpzcyJ9.XDDDRRq5jYq5EdEBHtPm7GcuBz4S0VhDTS1amRCdf48";
    String newJwt = JwtUtils.copyJwt(oldJwt, JwtUtils.JWT_WEB_TTL);
    System.out.println(newJwt);
    Claims parseJwt = JwtUtils.parseJwt(newJwt);
    for (Map.Entry<String, Object> entry : parseJwt.entrySet()) {
      System.out.println(entry.getKey() + "=" + entry.getValue());
    }
    Date d1 = parseJwt.getIssuedAt();
    Date d2 = parseJwt.getExpiration();
    System.out.println("令牌签发时间：" + sdf.format(d1));
    System.out.println("令牌过期时间：" + sdf.format(d2));
  }
  @Test
  public void test4() {// 测试JWT的有效时间
    Map<String, Object> claims = new HashMap<String, Object>();
    claims.put("username", "zss");
    String jwt = JwtUtils.createJwt(claims, 3 * 1000L);
    System.out.println(jwt);
    Claims parseJwt = JwtUtils.parseJwt(jwt);
    Date d1 = parseJwt.getIssuedAt();
    Date d2 = parseJwt.getExpiration();
    System.out.println("令牌签发时间：" + sdf.format(d1));
    System.out.println("令牌过期时间：" + sdf.format(d2));
  }
  @Test
  public void test5() {// 三秒后再解析上面过期时间只有三秒的令牌，因为过期则会报错io.jsonwebtoken.ExpiredJwtException
    //String oldJwt = "eyJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MzU1NjMzODIsImlhdCI6MTYzNTU2MTU4MiwiYWdlIjoxOCwianRpIjoiN2RlYmIzM2JiZTg3NDBmODgzNDI5Njk0ZWE4NzcyMTgiLCJ1c2VybmFtZSI6InpzcyJ1.F4pZFCjWP6wlq8v_udfhOkNCpErF5QlL7DXJdzXTHqE";
    String oldJwt = "eyJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJ6a2luZyIsImV4cCI6MTY2MjM0Njg3MSwiaWF0IjoxNjYyMzQ1MDcxLCJhZ2UiOjE4LCJqdGkiOiI4YjllNzc3YzFlMDM0MjViYThmMDVjNTFlMTU3NDQ1MiIsInVzZXJuYW1lIjoienNzIn9.UWpJxPxwJ09PKxE2SY5ME41W1Kv3jP5bZGKK-oNUDuM";
    Claims parseJwt = JwtUtils.parseJwt(oldJwt);
    // 过期后解析就报错了，下面代码根本不会执行
    Date d1 = parseJwt.getIssuedAt();
    Date d2 = parseJwt.getExpiration();
    System.out.println("令牌签发时间：" + sdf.format(d1));
    System.out.println("令牌过期时间：" + sdf.format(d2));
  }
}

切入spa项目

UserController

在我们的是UserController中放开以下代码

  @RequestMapping("/userLogin")
    @ResponseBody
    public JsonResponseBody<?> userLogin(UserVo userVo, HttpServletResponse response) {
        if (userVo.getUsername().equals("admin") && userVo.getPassword().equals("123")) {
//            私有要求claim
            Map<String,Object> json=new HashMap<String,Object>();
            json.put("username", userVo.getUsername());
//            生成JWT，并设置到response响应头中
            String jwt=JwtUtils.createJwt(json, JwtUtils.JWT_WEB_TTL);
            response.setHeader(JwtUtils.JWT_HEADER_KEY, jwt);
            return new JsonResponseBody<>("用户登陆成功！", true, 0, null);
        } else {
            return new JsonResponseBody<>("用户名或密码错误！", false, 0, null);
        }
    }
wtFilter

wel. xml

在我们的wel.xml中将我们的CorsFilter2更改成我们的CoresFilter

state.js
//  定义变量
export  default {
    eduName:'5211314',
    jwt:""
}
mutations.js
//设置值
export  default {
    setEeduName:(state,payload)=>{
       //state 就是 state.js文件导出的参数
       // payload vue 传递的参数
       state.eduName=payload.eduName;
    },
    setJwt:function(state,payload){
      state.jwt=payload.jwt;
    }
}
getters.js
// /取值
export  default {
    getEeduName:(state)=>{
     return state.eduName;
    },
    getJwt:function(state){
     return state.jwt;
    }
}
请求拦截器
// 请求拦截器
axios.interceptors.request.use(function(config) {
let jwt=window.vm.$store.getters.getJwt;
if (jwt) {
    config.headers['jwt']=jwt;
}
  return config;
}, function(error) {
  return Promise.reject(error);
});
响应拦截器
// 响应拦截器
axios.interceptors.response.use(function(response){
  let jit = response.headers['jwt'];
  if(jwt){
    window.vm.$store.commit('setJwt',{
      jwt:jwt
  });
  }
  return response;
}, function(error) {
  return Promise.reject(error);
});

0a0b05e9ed9148ce8daaae807511f10c.png

文章标签：
前端开发
数据格式
数据安全/隐私保护
JSON
XML
关键词：
jwt项目
jwt工具类spa项目
jwt工具类
jwt概念
Alone秋
目录
相关文章
小蜗牛耶
|
4月前
|
存储 JSON JavaScript
前后端分离项目知识汇总（微信扫码登录，手机验证码登录，JWT）-1
前后端分离项目知识汇总（微信扫码登录，手机验证码登录，JWT）
小蜗牛耶
133 0
toddli
|
25天前
|
JSON API 数据安全/隐私保护
Django 后端架构开发：JWT 项目实践与Drf版本控制
Django 后端架构开发：JWT 项目实践与Drf版本控制
toddli
32 0
左诗右码
|
1月前
|
存储 JSON 安全
在项目中到底应不应该用jwt？
JSON Web Tokens（JWT）是一种开放标准，用于在网络上传输安全信息。它常用于身份验证场景，用户登录后，服务器生成JWT并返回给客户端。客户端在后续请求中携带此令牌，服务器验证其有效性来确认用户身份。JWT具有无状态、可扩展和安全的特点，支持跨域认证，但也有令牌大小、续期复杂等缺点。是否使用JWT取决于项目需求，多数公司在采用，除非有特殊理由避免。以下是Go语言中使用JWT的一个示例。
左诗右码
50 0
小蜗牛耶
|
10月前
|
JSON 前端开发 安全
前后端分离项目知识汇总（微信扫码登录，手机验证码登录，JWT）-2
前后端分离项目知识汇总（微信扫码登录，手机验证码登录，JWT）
小蜗牛耶
77 0
小蜗牛耶
|
4月前
|
JSON 前端开发 安全
前后端分离项目知识汇总（微信扫码登录，手机验证码登录，JWT）-2
前后端分离项目知识汇总（微信扫码登录，手机验证码登录，JWT）
小蜗牛耶
98 0
朱琳均
|
9月前
|
JSON 数据格式
jwt-＞jwt简介，jwt工具类，jwt集进成spa项目
jwt-＞jwt简介，jwt工具类，jwt集进成spa项目
朱琳均
66 0
小蜗牛耶
|
10月前
|
存储 JSON JavaScript
前后端分离项目知识汇总（微信扫码登录，手机验证码登录，JWT）-1
前后端分离项目知识汇总（微信扫码登录，手机验证码登录，JWT）
小蜗牛耶
96 0
Love-Java.
|
10月前
|
JSON JavaScript 算法
[Vue]之Jwt的入门和Jwt工具类的使用及Jwt集成spa项目
[Vue]之Jwt的入门和Jwt工具类的使用及Jwt集成spa项目
Love-Java.
148 0
阿甘兄
|
10月前
|
算法 Java 数据安全/隐私保护
微服务轮子项目（20） -JWT的RSA非对称密钥生成
微服务轮子项目（20） -JWT的RSA非对称密钥生成
阿甘兄
43 0
百色彭于晏
|
1月前
|
SQL Java 测试技术
在Spring boot中 使用JWT和过滤器实现登录认证
在Spring boot中 使用JWT和过滤器实现登录认证
百色彭于晏
103 0

热门文章

最新文章

  • 1
    如何在SpringBoot中集成JWT(JSON Web Token)鉴权
  • 2
    使用JWT简化http接口鉴权，告别烦人的加密、解密代码吧
  • 3
    spring cloud放弃系列之--5-jwt
  • 4
    云原生最佳实践系列 6：MSE 云原生网关使用 JWT 进行认证鉴权
  • 5
    Spring Cloud实战 | 第六篇：Spring Cloud Gateway+ Spring Security OAuth2 + JWT实现微服务统一认证鉴权
  • 6
    SpringCloud Alibaba微服务实战三十五 - 退出登录注销 jwt token
  • 7
    【Spring Boot 快速入门】十九、Spring Boot 集成JWT
  • 8
    微服务网关鉴权：gateway使用、网关限流使用、用户密码加密、JWT鉴权（二）
  • 9
    自己写token类（无视jwt）
  • 10
    在线JWT Token解析解码工具
  • 1
    切图仔做全栈：React&Nest.js社区平台(一)——基础架构与邮箱注册、JWT登录实现
    114
  • 2
    Serverless 应用引擎产品使用之阿里函数计算中要关掉http触发器的jwt认证才可以进行性能探测如何解决
    50
  • 3
    node实战——后端koa结合jwt连接mysql实现权限登录（node后端就业储备知识）
    74
  • 4
    使用JWT的服务分布式部署之后报错：JWT Check Failure:
    94
  • 5
    微服务之Springboot整合Oauth2.0 + JWT
    101
  • 6
    ❤Nodejs 第九章（token身份认证和express-jwt的安装认识）
    89
  • 7
    JWT解密：探秘令牌魔法与Java的完美交互
    55
  • 8
    Springboot+Spring security +jwt认证+动态授权
    180
  • 9
    SpringCloud Gateway 实现自定义全局过滤器 + JWT权限验证
    258
  • 10
    面试官：Session和JWT有什么区别？
    91

    • 相关电子书

    更多
  • 低代码开发师（初级）实战教程
  • 冬季实战营第三期：MySQL数据库进阶实战
  • 阿里巴巴DevOps 最佳实践手册
    • 下一篇
    通义千问API入门教程