利用hutool工具类实现验证码功能


利用hutool工具类,可以很方便生成不同类型的验证码。这里简单记录下使用过程。

一.生成验证码

提供接口将生成的验证码存入session或redis,将验证码以图片格式或者base64编码串返回给调用端。

二.校验验证码

提供接口将收到调用端传过来的校验码,从session或redis取出验证码,两个验证码都全部转小写,进行无大小写区分匹配校验,返回true/flase 。

三.使用案例

1.引入hutool工具类

        <!-- hutool工具类 -->
        <dependency>
            <groupId>cn.hutool</groupId>
            <artifactId>hutool-all</artifactId>
            <version>5.7.12</version>
        </dependency>

2.VerifyCodeResp接口响应体

@Data
public class VerifyCodeResp implements Serializable {
    /**
     * header头参数:Captcha-Key
     */
    private String captchaKey;

    /**
     * 验证码图片
     */
    private String captchaImg;
}

3.VerifyCodeController验证码工具类

/**
 * 验证码工具类
 */
@RestController
public class VerifyCodeController {
    @Resource
    RedisTemplate<String, String> redisTemplate;

    /**
     * 生成验证码
     *
     * 方法一 ShearCaptcha
     * 图片格式
     * session存储
     * 接口需添加白名单放行
     *
     * @param request HttpServletRequest
     */
    @GetMapping("/verify")
    public void verify(HttpServletRequest request, HttpServletResponse response) throws IOException {
        response.setContentType("image/jpeg");
        response.setHeader("Pragma", "no-cache");
        response.setHeader("Cache-Control", "no-cache");
        response.setDateHeader("Expires", 0);
        //定义图形验证码的长、宽、验证码字符数、干扰线宽度
        ShearCaptcha shearCaptcha = CaptchaUtil.createShearCaptcha(150, 40, 5, 4);
        //图形验证码写出,可以写出到文件,也可以写出到流
        shearCaptcha.write(response.getOutputStream());
        //获取验证码中的文字内容
        request.getSession().setAttribute("verifyCode", shearCaptcha.getCode());
    }

    /**
     * 生成验证码
     *
     * 方法二 LineCaptcha
     * 图片格式
     * session存储
     * 接口需添加白名单放行
     *
     * @param request HttpServletRequest
     */
    @GetMapping("/verifyTwo")
    public void verifyTwo(HttpServletRequest request, HttpServletResponse response) throws IOException {
        response.setContentType("image/jpeg");
        response.setHeader("Pragma", "no-cache");
        response.setHeader("Cache-Control", "no-cache");
        response.setDateHeader("Expires", 0);
        //定义图形验证码的长、宽、验证码字符数、干扰线宽度
        LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(150, 40, 5, 4);
        //图形验证码写出,可以写出到文件,也可以写出到流
        ImageIO.write(lineCaptcha.getImage(), "JPEG", response.getOutputStream());
        //获取验证码中的文字内容
        request.getSession().setAttribute("verifyCode", lineCaptcha.getCode());
    }

    /**
     * 方法三 ShearCaptcha
     * 图片的base64编码字符串
     * session存储
     * 接口需添加白名单放行
     *
     * @param request HttpServletRequest
     * @return String
     */
    @GetMapping("/getVerify")
    public String getVerify(HttpServletRequest request) {
        //定义图形验证码的长、宽、验证码字符数、干扰线宽度
        ShearCaptcha shearCaptcha = CaptchaUtil.createShearCaptcha(150, 40, 5, 4);
        //获取验证码中的文字内容
        request.getSession().setAttribute("verifyCode", shearCaptcha.getCode());
        String base64String = "";
        try {
            base64String = "data:image/png;base64," + shearCaptcha.getImageBase64();
        } catch (Exception e) {
            e.printStackTrace();
        }
        return base64String;
    }

    /**
     * 方法四 LineCaptcha
     * 图片的base64编码字符串
     * session存储
     * 接口需添加白名单放行
     *
     * @param request HttpServletRequest
     * @return String
     */
    @GetMapping("/getVerifyTwo")
    public String getVerifyTwo(HttpServletRequest request) {
        //定义图形验证码的长、宽、验证码字符数、干扰线宽度
        LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(150, 40, 5, 4);
        //获取验证码中的文字内容
        request.getSession().setAttribute("verifyCode", lineCaptcha.getCode());
        String base64String = "";
        try {
            //返回 base64
            ByteArrayOutputStream bos = new ByteArrayOutputStream();
            ImageIO.write(lineCaptcha.getImage(), "JPEG", bos);
            byte[] bytes = bos.toByteArray();
            Base64.Encoder encoder = Base64.getEncoder();
            base64String = "data:image/png;base64," + encoder.encodeToString(bytes);
        } catch (Exception e) {
            e.printStackTrace();
        }
        return base64String;
    }

    /**
     * 方法五 ShearCaptcha
     * 图片的base64编码字符串
     * redis存储
     * 接口需添加白名单放行
     *
     * @return String
     */
    @GetMapping("/getVerifyThree")
    public VerifyCodeResp getVerifyThree() {
        String captchaKey = UUID.randomUUID().toString();
        //定义图形验证码的长、宽、验证码字符数、干扰线宽度
        ShearCaptcha shearCaptcha = CaptchaUtil.createShearCaptcha(150, 40, 5, 0);
        // 存入redis并设置过期时间为30分钟
        redisTemplate.opsForValue().set("captcha:" + captchaKey, shearCaptcha.getCode(), 30L, TimeUnit.MINUTES);
        String base64String = "";
        try {
            base64String = "data:image/png;base64," + shearCaptcha.getImageBase64();
        } catch (Exception e) {
            e.printStackTrace();
        }
        VerifyCodeResp verifyCodeResp = new VerifyCodeResp();
        verifyCodeResp.setCaptchaKey(captchaKey);
        verifyCodeResp.setCaptchaImg(base64String);
        return verifyCodeResp;
    }

    /**
     * 方法六 LineCaptcha
     * 图片的base64编码字符串
     * redis存储
     * 接口需添加白名单放行
     *
     * @return String
     */
    @GetMapping("/getVerifyFour")
    public VerifyCodeResp getVerifyFour() {
        String captchaKey = UUID.randomUUID().toString();
        //定义图形验证码的长、宽、验证码字符数、干扰线宽度
        LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(150, 40, 5, 4);
        // 存入redis并设置过期时间为30分钟
        redisTemplate.opsForValue().set("captcha:" + captchaKey, lineCaptcha.getCode(), 30L, TimeUnit.MINUTES);
        String base64String = "";
        try {
            //返回 base64
            ByteArrayOutputStream bos = new ByteArrayOutputStream();
            ImageIO.write(lineCaptcha.getImage(), "JPEG", bos);
            byte[] bytes = bos.toByteArray();
            Base64.Encoder encoder = Base64.getEncoder();
            base64String = "data:image/png;base64," + encoder.encodeToString(bytes);
        } catch (Exception e) {
            e.printStackTrace();
        }
        VerifyCodeResp verifyCodeResp = new VerifyCodeResp();
        verifyCodeResp.setCaptchaKey(captchaKey);
        verifyCodeResp.setCaptchaImg(base64String);
        return verifyCodeResp;
    }
}

4.测试验证

如果测试验证码存入redis,则需要提前配置和启动redis。
在这里插入图片描述
在这里插入图片描述

5.项目结构及源码下载

在这里插入图片描述
下载地址 springboot-cacheable 欢迎star哦~

  • 2
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
要在页面中实现hutool工具类的图形验证码,你需要完成以下步骤: 1. 在你的项目中引入hutool工具类库,可以通过Maven或Gradle等构建工具来实现。 2. 在你的页面中添加一个img标签,用于显示验证码图片。 3. 在后端代码中,使用hutool工具类生成验证码,并将验证码存储到Session中,以便在验证时使用。 4. 将生成验证码图片以Base64编码的形式返回给前端页面,以便显示。 下面是一个示例代码,演示了如何在页面中实现hutool工具类的图形验证码: ``` <!-- 页面中添加一个img标签用于显示验证码 --> <img id="captchaImg" src="" /> <!-- 在页面中添加一个按钮,用于刷新验证码 --> <button onclick="refreshCaptcha()">刷新验证码</button> <script> // 刷新验证码 function refreshCaptcha() { // 发送Ajax请求获取新的验证码 $.ajax({ url: "/captcha", type: "get", success: function(data) { // 将Base64编码的验证码图片显示在img标签中 $("#captchaImg").attr("src", "data:image/jpeg;base64," + data); } }); } </script> // 后端代码 // 生成验证码 CaptchaUtil.createLineCaptcha(width, height, codeCount, lineCount); // 将验证码存储到Session中 HttpUtil.getSession().setAttribute("captcha", captcha.getCode()); // 将Base64编码的验证码图片返回给前端页面 return Base64.encode(captcha.getImageBytes()); ``` 注意:以上代码仅为示例,实际使用时需要根据自己的项目情况进行修改。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值