登录图片验证码

导入糊涂依赖

<!--hutool-->
<dependency>
    <groupId>cn.hutool</groupId>
    <artifactId>hutool-all</artifactId>
    <version>4.6.8</version>
</dependency>

后台图片验证码生成

    /**
     * 图片验
     * 证
     */
    @RequestMapping("codeImg")
    public void codeImg(HttpServletResponse response){
        //定义图形验证码的长和宽
        LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(200, 100);
        //告诉浏览器的类型
        response.setContentType("image/jpg");

        try {
            ServletOutputStream outputStream = response.getOutputStream();
            lineCaptcha.write(outputStream);
            //获取图片验证码内容
            String code = lineCaptcha.getCode();
            //存到redis 登录是获取进行前后对比
            redisTemplate.opsForValue().set("codeImg",code);
            outputStream.close();
        }catch (IOException e){
            e.printStackTrace();
        }
    }

前端代码

 <img src="http://localhost:91/user/codeImg" style="width: 80px; height: 30px; margin: 25px 0 -10px 10px;" @click="list">