SpringBoot验证码之使用hutool-captcha方式实现验证码生成与验证
生成验证码:
提供一个接口, 这个接口里,我们将生成的验证码存入session,然后将验证码以图片格式或者base64编码串返回给调用端。
校验验证码:
提供一个接口,这个接口里,我们收到调用端传过来的校验码,然后从session取出验证码,两个验证码都全部转小写,进行无大小写区分匹配校验,返回true/flase 。
1、pom文件中导入hutool-captcha依赖
cn.hutool hutool-all 5.7.12
2、创建后端控制类生成验证码
创建控制类CommonController类,一方面通过流的方式将随机生成的验证码图片信息发送到前端浏览器;另一方面将验证码中的验证信息写入session中,以方便后续的验证。
import cn.hutool.captcha.CaptchaUtil;
import cn.hutool.captcha.LineCaptcha;import cn.hutool.captcha.ShearCaptcha;
import VerifyCodeVO;
import io.swagger.annotations.Api;
import io.swagger.annotations.ApiOperation;
import org.springframework.data.redis.core.RedisTemplate;
import org.springframework.web.bind.annotation.*;import javax.annotation.Resource;
import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.ByteArrayOutputStream;
import java.io.IOException;
import java.util.Base64;
import java.util.UUID;
import java.util.concurrent.TimeUnit;/*** @author author*/
@RestController
@Api(tags = "验证码工具类")
public class CommonController {@ResourceRedisTemplate redisTemplate;/*** 方法一 ShearCaptcha* 图片格式* session存储* 接口需添加白名单放行** @param request HttpServletRequest*/@GetMapping("/verify")@ApiOperation("生成验证码")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")@ApiOperation("生成验证码")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")@ApiOperation("生成验证码")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")@ApiOperation("生成验证码")public String getVerifyTwo(HttpServletRequest request) {//定义图形验证码的长、宽、验证码字符数、干扰线宽度LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(150, 40, 5, 4);//获取验证码中的文字内容request.getSession().setAttribute("verifyCode", lineCaptcha.getCode());String base64String = "";try {//返回 base64ByteArrayOutputStream 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")@ApiOperation("生成验证码")public VerifyCodeVO 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);//captcha:d6e561a6-7929-4469-8154-008710932f61String base64String = "";try {base64String = "data:image/png;base64," + shearCaptcha.getImageBase64();} catch (Exception e) {e.printStackTrace();}VerifyCodeVO verifyCodeVO = new VerifyCodeVO();verifyCodeVO.setCaptchaKey(captchaKey);verifyCodeVO.setCaptchaImg(base64String);return verifyCodeVO;}/*** 方法六 LineCaptcha* 图片的base64编码字符串* redis存储* 接口需添加白名单放行** @return String*/@GetMapping("/getVerifyFour")@ApiOperation("生成验证码")public VerifyCodeVO 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);//captcha:d6e561a6-7929-4469-8154-008710932f61String base64String = "";try {//返回 base64ByteArrayOutputStream 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();}VerifyCodeVO verifyCodeVO = new VerifyCodeVO();verifyCodeVO.setCaptchaKey(captchaKey);verifyCodeVO.setCaptchaImg(base64String);return verifyCodeVO;}
}
3、实现验证码的验证与返回结果
对前端输入的数据并发送到服务器的验证信息进行校验,当输入信息与验证码信息一致则返回true,否则返回false。
/*** session存储** @param captchaCode 验证码* @param request HttpServletRequest* @return boolean*/@GetMapping("/checkCaptcha")@ApiOperation("验证码校验")public boolean getCheckCaptcha(@RequestParam("captchaCode") String captchaCode, HttpServletRequest request) {try {// toLowerCase() 不区分大小写进行验证码校验String sessionCode = String.valueOf(request.getSession().getAttribute("verifyCode")).toLowerCase();System.out.println("session里的验证码:" + sessionCode);String receivedCode = captchaCode.toLowerCase();System.out.println("用户的验证码:" + receivedCode);return !"".equals(sessionCode) && !"".equals(receivedCode) && sessionCode.equals(receivedCode);} catch (Exception e) {return false;}}/*** redis存储** @param captchaCode 验证码* @param request HttpServletRequest* @return boolean*/@GetMapping("/checkCaptchaTwo")@ApiOperation("验证码校验")@ApiImplicitParam(value = "Captcha-Key", name = "Captcha-Key", paramType = "header", dataType = "String", required = true)public boolean getCheckCaptchaTwo(@RequestParam("captchaCode") String captchaCode, HttpServletRequest request) {try {// toLowerCase() 不区分大小写进行验证码校验String redisCode = String.valueOf(redisTemplate.opsForValue().get("captcha:" + request.getHeader("Captcha-Key"))).toLowerCase();System.out.println("redisCode里的验证码:" + redisCode);String receivedCode = captchaCode.toLowerCase();System.out.println("用户的验证码:" + receivedCode);return !"".equals(redisCode) && !"".equals(receivedCode) && redisCode.equals(receivedCode);} catch (Exception e) {return false;}}
Redis存储,返回工具类:
import io.swagger.annotations.ApiModelProperty;
import lombok.Data;import java.io.Serializable;@Data
public class VerifyCodeVO implements Serializable {@ApiModelProperty(value = "header头参数:Captcha-Key")private String captchaKey;@ApiModelProperty(value = "验证码图片")private String captchaImg;
}
启动应用,访问 http://localhost:8080/verify 即可得到验证码,如图:

前端调用展示:在img标签中src属性调用 /verify 接口,将传过来的图片验证码显示即可。若想换一张显示(刷新验证码):在img标签中增加一个onclick属性点击事件即可。

本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!
