使用Kaptcha实现的验证码功能

目录

一.需求

二.验证码功能实现步骤

验证码

引入kaptcha依赖

完成application.yml配置文件

浏览器显示验证码

前端页面

登录页面

验证成功页面

后端

---

此验证码功能是以SpringBoot框架下基于kaptcha插件来实现的。

一.需求

1.页面生成验证码

2.输入验证码，点击提交，验证用户输入的验证码是否正确，正确则进行页面跳转

二.验证码功能实现步骤

1.生成内容（根据词库）

2.生成干扰项

3.二者组成图片，返回

验证码

引入kaptcha依赖

			com.oopsguy.kaptcha
			kaptcha-spring-boot-starter
			1.0.0-beta-2

完成application.yml配置文件

kaptcha:
#  图片大小
  image:
    width: 100
    height: 60
#  字体
  text-producer:
    font:
      size: 28
  items:
#    home captcha
    admin:
     path: /admin/captcha
     session:
       key: HOME_KAPTCHA_SESSION_KEY
       data: HOME_KAPTCHA_SESSION_DATE

浏览器显示验证码

运行：即可在浏览器访问验证码

前端页面

登录页面

  

  
  



  
输入验证码
  

    
    
    
  
  
  

验证成功页面

    
    
    


    
验证成功

后端

package com.lele.demo.controller;

import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import javax.servlet.http.HttpSession;
import javax.xml.crypto.Data;
import java.util.Date;

@RequestMapping("/admin")
@RestController
public class CaptchaController {
    private static final String KAPTCHA_SESSION_KEY= "HOME_KAPTCHA_SESSION_KEY";
    private static final String KAPTCHA_SESSION_DATE="HOME_KAPTCHA_SESSION_DATE";
    //一分钟60秒，一秒1000毫秒
    private static final Long SESSION_TIME_OUT=60*1000L;

//    1.从session中获取生成的验证码
//    2.对比前端的验证码与session中的是否一样
    //验证成功返回true 失败返回false
    @RequestMapping("/check")
    public Boolean check(String captcha ,HttpSession session){
        if(!StringUtils.hasLength(captcha)){
            return false;
        }
        //从session中获取验证码
        String saveCaptcha=(String) session.getAttribute(KAPTCHA_SESSION_KEY);
        Date saveDate=(Date) session.getAttribute(KAPTCHA_SESSION_DATE);
        //比对验证码
        if(captcha.equals(saveCaptcha)){
            //比对日期
            if(saveDate==null || System.currentTimeMillis()-saveDate.getTime()

测试后端代码

实现结果