springboot整合kaptcha验证码的示例代码

时间：2021-05-19

前言:

关于kaptcha简介以及spring整合kaptcha，我在另一篇文章中已详细讲解，请参考:spring整合kaptcha验证码。

本文将介绍springboot整合kaptcha的两种方式。

开发工具及技术:

1、idea 2017
2、springboot 2.0.2
3、kaptcha

正式开始:

方式一:通过kaptcha.xml配置

1、用idea新建一个spring Initializr

2、添加kaptcha的依赖:

<dependency> <groupId>com.github.penggle</groupId> <artifactId>kaptcha</artifactId> <version>2.3.2</version> </dependency>

3、在resources下面新建kaptcha.xml，内容如下:

kaptcha.xml

<?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://.google.code.kaptcha.Constants.KAPTCHA_SESSION_KEY); //获取用户输入的验证码 String verifyCodeActual = CodeUtil.getString(request, "verifyCodeActual"); if(verifyCodeActual == null ||!verifyCodeActual.equals(verifyCodeExpected)) { return false; } return true; }}

注:这个类用来比对生成的验证码与用户输入的验证码。生成的验证码会自动加到session中，用户输入的通过getParameter获得。注意getParameter的key值要与页面中验证码的name值一致。

7、使用验证码:

①Controller

HelloWorld.java

@RestControllerpublic class HelloWorld { @RequestMapping("/hello") public String hello(HttpServletRequest request) { if (!CodeUtil.checkVerifyCode(request)) { return "验证码有误！"; } else { return "hello,world"; } }}

②页面

hello.html

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript"> function refresh() { document.getElementById('captcha_img').src="/kaptcha?"+Math.random(); } </script></head><body><form action="/hello" method="post"> 验证码: <input type="text" placeholder="请输入验证码" name="verifyCodeActual"> <div class="item-input"> <img id="captcha_img" alt="点击更换" title="点击更换" onclick="refresh()" src="/kaptcha" /> </div> <input type="submit" value="提交" /></form></body></html>

注意:验证码本质是一张图片，所以用<img >标签，然后通过src = "/kaptcha"指向生成验证码的那个controller的路由即可;通过onclick = “refresh()”调用js代码实现点击切换功能;<input name = "verifyCodeActual ">中要注意name的值，在CodeUtil中通过request的getParameter()方法获取用户输入的验证码时传入的key值就应该和这里的name值一致。

8、测试:

输入正确的验证码

验证通过

输入错误的验证码

验证未通过

方式二:通过配置类来配置kaptcha

1、配置kaptcha

相比于方式一，一增二减。

减:

①把kaptcha.xml删掉
②把启动类上的@ImportResource(locations = {"classpath:kaptcha/kaptcha.xml"})注解删掉

增:

①新建KaptchaConfig配置类，内容如下:

KaptchaConfig.java

@Configurationpublic class KaptchaConfig { @Bean public DefaultKaptcha getDefaultKaptcha(){ DefaultKaptcha captchaProducer = new DefaultKaptcha(); Properties properties = new Properties(); properties.setProperty("kaptcha.border", "yes"); properties.setProperty("kaptcha.border.color", "105,179,90"); properties.setProperty("kaptcha.textproducer.font.color", "blue"); properties.setProperty("kaptcha.image.width", "110"); properties.setProperty("kaptcha.image.height", "40"); properties.setProperty("kaptcha.textproducer.font.size", "30"); properties.setProperty("kaptcha.session.key", "code"); properties.setProperty("kaptcha.textproducer.char.length", "4"); properties.setProperty("kaptcha.textproducer.font.names", "宋体,楷体,微软雅黑"); Config config = new Config(properties); captchaProducer.setConfig(config); return captchaProducer; }}

注:这个类用来配置Kaptcha，就相当于方式一的kaptcha.xml，把kaptcha加入IOC容器，然后return 回一个设置好属性的实例，最后注入到CodeController中，在CodeController中就可以使用它生成验证码。要特别注意return captchaProducer;与private Producer captchaProducer = null;中captchaProducer名字要一样，不然就加载不到这个bean。

2、测试:

输入正确的验证码:

验证通过

输入错误的验证码

验证未通过

为了说明两次的验证码是基于两种方式生成的，方式一和方式二的验证码我设置了不同的属性，从图片中可以看出两次验证码的颜色、干扰线、背景等都有不同。

总结:

1、过程梳理:

不论是哪种方式，都是先把kaptcha加入spring容器，即要有一个kaptcha的bean;再新建一个controller，把kaptcha的bean注入到controller中用于生成验证码;然后需要有一个比对验证码的工具类，在测试的controller中调用工具类进行验证码比对;最后在前端页面只需要用一个<img src = "/生成验证码的controller的路由">即可获取验证码，通过给这个img标签加点击事件就可实现“点击切换验证码”。

2、与spring整合kaptcha对比

spring整合kaptcha也介绍了两种方式，在web.xml中配置最简洁，不需要写生成验证码的controller，在页面中直接用src指向web.xml中kaptcha的servlet 的<url-pattern >的值即可。

springboot整合kaptcha的两种方式都类似于spring整合kaptcha的第二种方式，都是先配置bean，然后用controller生成验证码，前端用src指向这个controller，不同之处在于:假如生成验证码的controller路由为/xxx，那么spring 整合kaptcha时src = “xxx.jpg”，springboot整合kaptcha时src = "/xxx"。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

springboot整合kaptcha验证码的示例代码

相关文章

SpringBoot集成kaptcha验证码

java下使用kaptcha生成验证码

kaptcha验证码组件使用简介解析

javaWeb使用Kaptcha组件生成验证码

spring整合kaptcha验证码的实现