项目1其二(验证码、jwt)
分析需求:1、验证码 2、登录验证jwt
一、验证码
我们采用将验证码存到redis的方式进行前后端数据验证
如何做一个redis呢。
1、RedisTemplate<Object, Object>这种类型的模板是不需要手动注册到容器里的
2、因此在Api里直接注入后,进行接口的编写即可
@GetMappingpublic void captcha(String id, HttpServletRequest req, jakarta.servlet.http.HttpServletResponse resp) throws IOException {SpecCaptcha captcha = new SpecCaptcha(140, 40, 4);resp.setContentType("image/gif");resp.setHeader("Pragma", "No-cache");resp.setHeader("Cache-Control", "no-cache");resp.setDateHeader("Expires", 0);//req.getSession().setAttribute("captcha", captcha.text().toLowerCase());redisTemplate.opsForValue().set("captcha-" + id, captcha.text().toLowerCase(), Duration.ofMinutes(3));captcha.out(resp.getOutputStream());}
前端可以通过:captchaUrl.value = “/api/captcha?id=” + captchaId.value;
通过el-image进行渲染
二、jwt
1、jwt生成工具
public static String createJwt(String username, String id, Map<String, Object> payloads, LocalDateTime expireTime, String secretKey) {JWTCreator.Builder builder = JWT.create();String jwt = builder.withPayload(payloads).withExpiresAt(expireTime.toInstant(ZoneOffset.of("+8"))).withIssuer("陈平安").withIssuedAt(Instant.now()).withSubject("用户认证").withAudience(username).withJWTId(id).sign(Algorithm.HMAC256(secretKey));return jwt;}
传给前端jwt即可
2、后端校验
先将之前工具里的参数secretKey写到配置文件里面,通过@Value(“${}”)读取值
定义拦截器
@Component
public class JwtInterceptor implements HandlerInterceptor
重写里面的preHandle用来拦截过来的请求,请求头没有前端给的jwt数据就拒绝
写好拦截器记得要去配置类里面进行注册
首先注入jwt拦截器,然后进行
三、前端接收并给后端的请求头上携带jwt
这里pinia里面就有jwt的值了,后续发送请求头就可以通过下面的axios拦截器进行请求头jwt的携带了
若前端给的响应里面有新的jwt,这里要及时更新
这里的token只是后端可能给了个叫token的头数据而已