介绍：
kaptcha是Google提供的一个图形验证码插件，有了它，你可以通过简单的配置生成各种样式的验证码。
1：SpringBoot引入kaptcha的依赖
<dependency><groupId>com.github.penggle</groupId><artifactId>kaptcha</artifactId><version>2.3.2</version></dependency>
2：编写kaptcha配置类
package simulationvirtual.VirtualExperiment.config;import com.google.code.kaptcha.Producer;import com.google.code.kaptcha.impl.DefaultKaptcha;import com.google.code.kaptcha.util.Config;import org.springframework.context.annotation.Bean;import org.springframework.context.annotation.Configuration;import java.util.Properties;@Configurationpublic class KaptchaConfig {/*** Kaptcha图形验证码工具配置类* @author: Xiongch* @param:* @return: com.google.code.kaptcha.Producer* @date: /9/9 15:47*/@Beanpublic Producer kaptchaProducer() {// 实例一个DefaultKaptchaDefaultKaptcha defaultKaptcha = 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", "125");// 高度properties.setProperty("kaptcha.image.height", "50");// 设置session.keyproperties.setProperty("kaptcha.session.key", "code");// 设置文本长度properties.setProperty("kaptcha.textproducer.char.length", "4");// 设置字体properties.setProperty("kaptcha.textproducer.font.names", "宋体,楷体,微软雅黑");// 将以上属性设置为实例一个DefaultKaptcha的属性Config config = new Config(properties);defaultKaptcha.setConfig(config);// 将defaultKaptcha返回return defaultKaptcha;}}
2.1：Kaptcha详细配置
3：编写Controller，实现验证码请求接口
package simulationvirtual.VirtualExperiment.controller.tools;import com.google.code.kaptcha.Producer;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.data.redis.core.RedisTemplate;import org.springframework.util.FastByteArrayOutputStream;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.RestController;import simulationvirtual.VirtualExperiment.util.AjaxResult;import simulationvirtual.VirtualExperiment.util.Base64;import simulationvirtual.VirtualExperiment.util.UUIDutil;import javax.imageio.ImageIO;import javax.servlet.http.HttpServletResponse;import javax.servlet.http.HttpSession;import java.awt.image.BufferedImage;import java.io.IOException;import java.util.concurrent.TimeUnit;@RestControllerpublic class KaptchaController {@Autowiredprivate RedisTemplate<String,Object> redisTemplate;@Autowiredprivate Producer kaptchaProduer;/*** 生成图形验证码* @author: Xiongch* @param:null* @return:Ajax_Result（统一返回工具）* @date: /9/9 15:47*/@GetMapping("/kaptcha")public AjaxResult getKaptcha(HttpServletResponse response, HttpSession session){AjaxResult Ajax_Result = AjaxResult.success();String imagecode = kaptchaProduer.createText();// 生成图片BufferedImage image = kaptchaProduer.createImage(imagecode);// 将验证码存入Sessionsession.setAttribute("kaptcha",imagecode);//将图片输出给浏览器String uuid = UUIDutil.getUUID();//uuid-->验证码唯一标识FastByteArrayOutputStream os = new FastByteArrayOutputStream();try {response.setContentType("image/png");ImageIO.write(image,"png",os);//验证码实现redis缓存，过期时间2分钟session.setAttribute("uuid",imagecode);redisTemplate.opsForValue().set(uuid,imagecode,2, TimeUnit.MINUTES);} catch (IOException e) {return AjaxResult.error(e.getMessage());}Ajax_Result.put("uuid",uuid);Ajax_Result.put("img", Base64.encode(os.toByteArray()));return Ajax_Result;}}
4：vue前端展示代码
<div class="login-code"><img :src="codeUrl" @click="getCode" class="login-code-img"/></div>
4.1:点击刷新方法
methods: {getCode() {this.$axios({method:'GET',url:"/kaptcha",headers: {"Content-Type": "application/json"}}).then(res=>{this.codeUrl = "data:image/gif;base64," + res.data.img;})},
