SpringBoot中集成kaptcha验证码

avatar 2018年05月04日16:55:13 6 4709 views
博主分享免费Java教学视频，B站账号：Java刘哥 ，长期提供技术问题解决、项目定制：本站商品点此
在一个web应用中验证码是一个常见的元素。不管是防止机器人还是爬虫都有一定的作用，我们是自己编写生产验证码的工具类，也可以使用一些比较方便的验证码工具。

本文介绍 SpringBoot 和 Kaptcha 集成。


一、pom.xml

  1. <dependency>
  2.     <groupId>com.github.penggle</groupId>
  3.     <artifactId>kaptcha</artifactId>
  4.     <version>2.3.2</version>
  5. </dependency>


二、配置验证码Kaptcha相关设置

  1. package com.liuyanzhao.forum.config;
  3. import com.google.code.kaptcha.impl.DefaultKaptcha;
  4. import com.google.code.kaptcha.util.Config;
  5. import org.springframework.context.annotation.Bean;
  6. import org.springframework.context.annotation.Configuration;
  8. import java.util.Properties;
  10. /**
  11.  * @author 言曌
  12.  * @date 2018/5/4 下午12:44
  13.  */
  15. @Configuration
  16. public class KaptchaConfig {
  17.     @Bean(name="captchaProducer")
  18.     public DefaultKaptcha getKaptchaBean(){
  19.         DefaultKaptcha defaultKaptcha=new DefaultKaptcha();
  20.         Properties properties=new Properties();
  21.         properties.setProperty("kaptcha.textproducer.char.string", "123456789");//验证码字符范围
  22.         properties.setProperty("kaptcha.border.color", "245,248,249");//图片边框颜色
  23.         properties.setProperty("kaptcha.textproducer.font.color", "black");//字体颜色
  24.         properties.setProperty("kaptcha.textproducer.char.space", "2");//文字间隔
  25.         properties.setProperty("kaptcha.image.width", "125");//图片宽度
  26.         properties.setProperty("kaptcha.image.height", "45");//图片高度
  27.         properties.setProperty("kaptcha.session.key", "code");//session的key
  28.         properties.setProperty("kaptcha.textproducer.char.length", "4");//长度
  29.         properties.setProperty("kaptcha.textproducer.font.names", "宋体,楷体,微软雅黑");//字体
  30.         Config config=new Config(properties);
  31.         defaultKaptcha.setConfig(config);
  32.         return defaultKaptcha;
  33.     }
  34. }



方法二、基于XML配置方式

1、在resources下创建myKaptcher.xml文件
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <beans xmlns="http://www.springframework.org/schema/beans"
  3.        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  4.        xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd">
  5.     <bean id="captchaProducer" class="com.google.code.kaptcha.impl.DefaultKaptcha">
  6.         <property name="config">
  7.             <bean class="com.google.code.kaptcha.util.Config">
  8.                 <constructor-arg type="java.util.Properties">
  9.                     <props>
  10.                         <prop key = "kaptcha.border ">yes</prop>
  11.                         <prop key="kaptcha.border.color">105,179,90</prop>
  12.                         <prop key="kaptcha.textproducer.font.color">blue</prop>
  13.                         <prop key="kaptcha.image.width">100</prop>
  14.                         <prop key="kaptcha.image.height">50</prop>
  15.                         <prop key="kaptcha.textproducer.font.size">27</prop>
  16.                         <prop key="kaptcha.session.key">code</prop>
  17.                         <prop key="kaptcha.textproducer.char.length">4</prop>
  18.                         <prop key="kaptcha.textproducer.font.names">宋体,楷体,微软雅黑</prop>
  19.                         <prop key="kaptcha.textproducer.char.string">23456789ABCEFGHJKMNOPQRSTUVWXYZ</prop>
  20.                         <prop key="kaptcha.obscurificator.impl">com.google.code.kaptcha.impl.WaterRipple</prop>
  21.                         <prop key="kaptcha.noise.color">black</prop>
  22.                         <prop key="kaptcha.noise.impl">com.google.code.kaptcha.impl.NoNoise</prop>
  23.                         <!--<prop key="kaptcha.noise.impl">com.google.code.kaptcha.impl.DefaultNoise</prop>-->
  24.                         <prop key="kaptcha.background.clear.from">185,56,213</prop>
  25.                         <prop key="kaptcha.background.clear.to">white</prop>
  26.                         <prop key="kaptcha.textproducer.char.space">3</prop>
  27.                     </props>
  28.                 </constructor-arg>
  29.             </bean>
  30.         </property>
  31.     </bean>
  32. </beans>



2、然后在启动类Application中加载配置
  1. @EnableTransactionManagement// 启动注解事务管理，等同于xml配置方式的 <tx:annotation-driven />
  2. @SpringBootApplication
  3. @EnableScheduling//启动注解定时任务
  4. @MapperScan(basePackages = "com.liuyanzhao.mapper")
  5. @ImportResource(locations={"classpath:mykaptcha.xml"})
  6. public class Application extends SpringBootServletInitializer {
  8.     public static void main(String[] args) throws Exception {
  9.         SpringApplication.run(Application.class, args);
  10.     }
  12. }



两种配置方式在springboot中均可，这里推荐前者。



具体参数配置如下






















































































































Constant 描述 默认值
kaptcha.border 图片边框，合法值：yes , no yes
kaptcha.border.color 边框颜色，合法值： r,g,b (and optional alpha) 或者 white,black,blue. black
kaptcha.border.thickness 边框厚度，合法值：>0 1
kaptcha.image.width 图片宽 200
kaptcha.image.height 图片高 50
kaptcha.producer.impl 图片实现类 com.google.code.kaptcha.impl.DefaultKaptcha
kaptcha.textproducer.impl 文本实现类 com.google.code.kaptcha.text.impl.DefaultTextCreator
kaptcha.textproducer.char.string 文本集合，验证码值从此集合中获取 abcde2345678gfynmnpwx
kaptcha.textproducer.char.length 验证码长度 5
kaptcha.textproducer.font.names 字体 Arial, Courier
kaptcha.textproducer.font.size 字体大小 40px.
kaptcha.textproducer.font.color 字体颜色，合法值： r,g,b  或者 white,black,blue. black
kaptcha.textproducer.char.space 文字间隔 2
kaptcha.noise.impl 干扰实现类 com.google.code.kaptcha.impl.DefaultNoise
kaptcha.noise.color 干扰颜色，合法值： r,g,b 或者 white,black,blue. black
kaptcha.obscurificator.impl 图片样式： 水纹com.google.code.kaptcha.impl.WaterRipple 鱼眼com.google.code.kaptcha.impl.FishEyeGimpy 阴影com.google.code.kaptcha.impl.ShadowGimpy com.google.code.kaptcha.impl.WaterRipple
kaptcha.background.impl 背景实现类 com.google.code.kaptcha.impl.DefaultBackground
kaptcha.background.clear.from 背景颜色渐变，开始颜色 light grey
kaptcha.background.clear.to 背景颜色渐变，结束颜色 white
kaptcha.word.impl 文字渲染器 com.google.code.kaptcha.text.impl.DefaultWordRenderer
kaptcha.session.key session key KAPTCHA_SESSION_KEY
kaptcha.session.date session date KAPTCHA_SESSION_DATE


三、Controller

  1. package com.liuyanzhao.forum.controller.common;
  3. import java.awt.image.BufferedImage;
  5. import javax.imageio.ImageIO;
  6. import javax.servlet.ServletOutputStream;
  7. import lombok.extern.apachecommons.CommonsLog;
  8. import org.springframework.beans.factory.annotation.Autowired;
  9. import org.springframework.stereotype.Controller;
  10. import org.springframework.web.bind.annotation.GetMapping;
  12. import com.google.code.kaptcha.Constants;
  13. import com.google.code.kaptcha.Producer;
  15. /**
  16.  * @author 言曌
  17.  * @date 2018/5/4 下午12:36
  18.  */
  20. @CommonsLog
  21. @Controller
  22. public class KaptchaController extends BaseController {
  24.     @Autowired
  25.     private Producer captchaProducer;
  26.     @GetMapping("/getKaptchaImage")
  27.     public void getKaptchaImage() throws Exception {
  29.         response.setDateHeader("Expires", 0);
  31.         // Set standard HTTP/1.1 no-cache headers.
  32.         response.setHeader("Cache-Control", "no-store, no-cache, must-revalidate");
  33.         // Set IE extended HTTP/1.1 no-cache headers (use addHeader).
  34.         response.addHeader("Cache-Control", "post-check=0, pre-check=0");
  35.         // Set standard HTTP/1.0 no-cache header.
  36.         response.setHeader("Pragma", "no-cache");
  37.         // return a jpeg
  38.         response.setContentType("image/jpeg");
  39.         // create the text for the image
  40.         String capText = captchaProducer.createText();
  41.         // store the text in the session
  42.         //request.getSession().setAttribute(Constants.KAPTCHA_SESSION_KEY, capText);
  43.         //将验证码存到session
  44.         session.setAttribute(Constants.KAPTCHA_SESSION_KEY, capText);
  45.         log.info(capText);
  46.         // create the image with the text
  47.         BufferedImage bi = captchaProducer.createImage(capText);
  48.         ServletOutputStream out = response.getOutputStream();
  49.         // write the data out
  50.         ImageIO.write(bi, "jpg", out);
  51.         try {
  52.             out.flush();
  53.         } finally {
  54.             out.close();
  55.         }
  56.     }
  57. }


四、验证码显示


直接访问 getKaptchaImage 就能显示图片

http://localhost:8080/forum/getKaptchaImage









在页面中显示，只需要添加下面代码

HTML
  1. <img th:src="@{/getKaptchaImage}" width="80" height="34" class="captcha changeCaptcha pull-left margin-r-5" alt="验证码"/>
  2. <a href="javascript:void(0)" class="changeCaptcha">换一张</a>

JS
  1. //切换验证码
  2.  $(document).on('click', '.changeCaptcha', function () {
  3.      var url = _ctx + "/getKaptchaImage";
  4.      $(".captcha").attr("src", url);
  5.  })



最终效果如下



















历史上的今天
五月
04日
  • 微信
  • 交流学习，资料分享
  • weinxin
  • 个人淘宝
  • 店铺名：言曌博客咨询部

  • (部分商品未及时上架淘宝)
avatar

发表评论

avatar 登录者：匿名
匿名评论，评论回复后会有邮件通知

  

已通过评论：0   待审核评论数：0