手把手教你基于 Kaptcha 验证码检验的登录

在网站实际应用过程中，为了防止网站登录接口被机器人轻易地使用，产生一些没有意义的用户数据，所以，采用验证码进行一定程度上的拦截，当然，我们采用的还是一个数字与字母结合的图片验证码形式。

实现思路

博主环境：springboot3 、java17、thymeleaf

1. 访问登录页面

2. 登录

   • 验证验证码
   • 验证账号、密码
   • 验证成功时，生成登录凭证，发放给客户端
   • 验证失败时，跳转回登录信息，并保留原有填入信息

3. 退出

   • 将登录凭证修改为失效状态
   • 跳转至首页

访问登录页面的方法已经在前文说明过了

就不多加赘述了，展示一下代码：

// 登录页面
@RequestMapping(path = "/login", method = RequestMethod.GET)
public String getLoginPage() {
    return "/site/login";
}
复制代码

访问完登录页面，我们就要进行信息输入，然而，现在，还没有把验证码信息正确展现出来，所以，接下来，我们先来实现验证码的部分。

所需两个数据表 SQL 代码如下：

-- user表
DROP TABLE IF EXISTS `user`;
 SET character_set_client = utf8mb4 ;
CREATE TABLE `user` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `username` varchar(50) DEFAULT NULL,
  `password` varchar(50) DEFAULT NULL,
  `salt` varchar(50) DEFAULT NULL,
  `email` varchar(100) DEFAULT NULL,
  `type` int(11) DEFAULT NULL COMMENT '0-普通用户; 1-超级管理员; 2-版主;',
  `status` int(11) DEFAULT NULL COMMENT '0-未激活; 1-已激活;',
  `activation_code` varchar(100) DEFAULT NULL,
  `header_url` varchar(200) DEFAULT NULL,
  `create_time` timestamp NULL DEFAULT NULL,
  PRIMARY KEY (`id`),
  KEY `index_username` (`username`(20)),
  KEY `index_email` (`email`(20))
) ENGINE=InnoDB AUTO_INCREMENT=101 DEFAULT CHARSET=utf8;

-- 登录凭证表
DROP TABLE IF EXISTS `login_ticket`;
 SET character_set_client = utf8mb4 ;
CREATE TABLE `login_ticket` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `user_id` int(11) NOT NULL,
  `ticket` varchar(45) NOT NULL,
  `status` int(11) DEFAULT '0' COMMENT '1-有效; 0-无效;',
  `expired` timestamp NOT NULL,
  PRIMARY KEY (`id`),
  KEY `index_ticket` (`ticket`(20))
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
复制代码

Kaptcha 验证码设计和校验

目前使用图片验证码较为广泛的是 Kaptcha ，它只有一个版本：2.3.2，值得注意的是，在 springboot 3的环境下，使用该插件包大部分会使用到的 http 包，不能导入 javax 包内的，而是应该导入jakarta 包内的。

它能够实现以下效果：水纹有干扰、鱼眼无干扰、水纹无干扰、阴影无干扰、阴影有干扰