目标

在后台写一个进行验证码验证,防止请求过快。

实现方法:在后台生产验证码并保存到session当中,将生成的验证码图片返回给前台,接收前台回传的数据时,对验证码进行验证,如果正确则进行下一步操作并清除session里存储的验证码,如果错误返回失败信息。

参考链接

配置kaptcha

kaptcha 是一个非常实用的验证码生成工具。有了它,你可以生成各种样式的验证码,因为它是可配置的。kaptcha工作的原理是调用 com.google.code.kaptcha.servlet.KaptchaServlet,生成一个图片

导入kaptcha依赖:

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

配置默认的kaptcha属性和获取:

@Componentpublic class VerificationCodeConfig {    @Bean    public DefaultKaptcha getDefaultKaptcha() {        DefaultKaptcha defaultKaptcha = new DefaultKaptcha();        Properties properties = new Properties();        properties.setProperty("kaptcha.textproducer.char.string", "123456789");//验证码字符范围        properties.setProperty("kaptcha.border.color", "245,248,249");//图片边框颜色        properties.setProperty("kaptcha.textproducer.font.color", "black");//字体颜色        properties.setProperty("kaptcha.textproducer.char.space", "2");//文字间隔        properties.setProperty("kaptcha.image.width", "125");//图片宽度        properties.setProperty("kaptcha.image.height", "45");//图片高度        properties.setProperty("kaptcha.textproducer.char.length", "4");//长度        properties.setProperty("kaptcha.textproducer.font.names", "宋体,楷体,微软雅黑");//字体        Config config = new Config(properties);        defaultKaptcha.setConfig(config);        return defaultKaptcha;    }}

生成验证码

用配置的defaultKaptcha对象生成验证码和验证码图片,将验证码写入session中,将验证码图片转化为字节流写入response中,前台就能获取到这个图片了.

@AutowiredDefaultKaptcha defaultKaptcha;@AutowiredHttpSession httpSession;    @Override    public void createVerificationCode(HttpServletResponse httpServletResponse,HandleVerificationCode handleVerificationCode) throws IOException {        byte[] captchaChallengeAsJpeg = null;        ByteArrayOutputStream jpegOutputStream = new ByteArrayOutputStream();        // 生产验证码字符串并保存到session中        String createText = defaultKaptcha.createText();        // 使用生产的验证码字符串返回一个BufferedImage对象并转为byte写入到byte数组中        BufferedImage challenge = defaultKaptcha.createImage(createText);        ImageIO.write(challenge, "jpg", jpegOutputStream);        captchaChallengeAsJpeg = jpegOutputStream.toByteArray();        httpSession.setAttribute(VERIFICATION_CODE_SESSION_KEY, codeText);        httpServletResponse.setHeader("Cache-Control", "no-store");        httpServletResponse.setHeader("Pragma", "no-cache");        httpServletResponse.setDateHeader("Expires", 0);        httpServletResponse.setContentType("image/jpeg");        ServletOutputStream responseOutputStream = null;        try {               responseOutputStream = httpServletResponse.getOutputStream();               responseOutputStream.write(captchaChallengeAsJpeg);               responseOutputStream.flush();               responseOutputStream.close();            } catch (IOException e) {               httpServletResponse.setStatus(HttpServletResponse.SC_NOT_FOUND);            }    }

获取验证码

用img标签获取图片就行了,每一次获取的图片都不一样.


<img src="api/CheckRecord/verificationCode" onclick="this.src='api/CheckRecord/verificationCode'">