【JavaEE进阶】实现验证码

最新推荐文章于 2024-03-06 07:50:13 发布
最新推荐文章于 2024-03-06 07:50:13 发布
阅读量1.1k 收藏 27
点赞数 31
分类专栏： JavaEE进阶 文章标签： java-ee java spring
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_71731682/article/details/135729303
版权

文章目录

🌲实现说明

随着安全性的要求越来越⾼,⽬前项⽬中很多都使⽤了验证码,验证码的形式也是多种多样,更复杂的图形验证码和⾏为验证码已经成为了更流⾏的趋势.
在这里插入图片描述

验证码的实现⽅式很多,⽹上也有⽐较多的插件或者⼯具包可以使⽤,这里博主选择使⽤Google的开源项⽬Kaptcha来实现.

🍃Kaptcha插件介绍

Kaptcha是Google的⼀个⾼度可配置的实⽤验证码⽣成⼯具.代码: 代码链接

⽹上有很多⼈甚⾄公司基于Google的kaptcha进⾏了⼆次开发.我们选择⼀个直接适配SpringBoot的开源项⽬：项目地址

下⾯简单介绍下插件的使⽤

🚩插件原理

验证码可以客⼾端⽣成,也可以服务器⽣成.对于普通的字符验证码,后端通常分两部分.

  • ⼀是⽣成验证码内容,根据验证码内容和⼲扰项等,⽣成图⽚,返回给客⼾端

  • ⼆是把验证码内容存储起来,校验时取出来进⾏对⽐.

kaptcha插件选择把验证码存储在Session⾥

🚩引入依赖

想要使用该插件，我们需要引入以下依赖

<dependency>
	<groupId>com.oopsguy.kaptcha</groupId>
	<artifactId>kaptcha-spring-boot-starter</artifactId>
	<version>1.0.0-beta-2</version>
</dependency>

🚩⽣成验证码

该插件提供了两种⽅式⽣成验证码

  • 通过代码来⽣成( 参考文档 不再介绍)

  • 仅通过配置⽂件来⽣成验证码(推荐)

博主这里实现也是使用验证码进行实现

🚩Kaptcha详细配置

关于Kaptcha详细配置如下表所示：

配置项配置说明默认值
kaptcha.border图⽚边框，合法值：yes,noyes
kaptcha.border.color边框颜⾊，合法值：r,g,b(and optionalalpha)或者white,black,blue.black
kaptcha.image.width图⽚宽200
kaptcha.image.height图⽚⾼50
kaptcha.producer.impl图⽚实现类com.google.code.kaptcha.impl.DefaultKaptcha
kaptcha.textproducer.impl⽂本实现类com.google.code.kaptcha.text.impl.DefaultTextCreator
kaptcha.textproducer.char.string⽂本集合，验证码值从此集合中获取abcde2345678gfynmnpwx
kaptcha.textproducer.char.length验证码⻓度5
kaptcha.textproducer.font.names字体Arial,Courier
kaptcha.textproducer.font.size字体⼤⼩40px.
kaptcha.textproducer.font.color字体颜⾊，合法值：r,g,b或者white,black,blue.black
kaptcha.textproducer.char.space⽂字间隔2
kaptcha.noise.impl⼲扰实现类com.google.code.kaptcha.impl.DefaultNoise
kaptcha.noise.color⼲扰颜⾊，合法值：r,g,b或者white,black,blue.black
kaptcha.obscurificator.impl图⽚样式:⽔纹com.google.code.kaptcha.impl.WaterRipple⻥眼com.google.code.kaptcha.impl.FishEyeGimpy阴影com.google.code.kaptcha.impl.ShadowGimpycom.google.code.kaptcha.impl.WaterRipple
kaptcha.background.impl背景实现类com.google.code.kaptcha.impl.DefaultBackground
kaptcha.background.clear.from背景颜⾊渐变，开始颜⾊light grey
kaptcha.background.clear.to背景颜⾊渐变，结束颜⾊white
kaptcha.word.impl⽂字渲染器 com.google.code.kaptcha.text.impl.DefaultWordRenderer
kaptcha.session.keysessionkey KAPTCHA_SESSION_KEY
kaptcha.session.datesession dateKAPTCHA_SESSION_DATE

使⽤ kaptcha.items可以 配置多个验证码⽣成器

kaptcha.items 是⼀个Map,key为验证码⽣成器名称,value为验证码⽣成器的配置

kaptcha:
 items:
  home:
   path: /home/captcha
   session:
    key: KAPTCHA_SESSION_KEY
    date: KAPTCHA_SESSION_DATE

在这里插入图片描述
配置后,可以直接访问http://XXXX:port/home/captcha即可⽣成验证码

了解了该插件后，我们来开始做项目

🍀准备⼯作

创建项⽬,引⼊SpringMVC的依赖包,把前端⻚⾯放在项⽬中(这里博主直接给出)

在这里插入图片描述
index.html代码如下：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">

  <title>验证码</title>
  <style>
    #inputCaptcha {
      height: 30px;
      vertical-align: middle; 
    }
    #verificationCodeImg{
      vertical-align: middle; 
    }
    #checkCaptcha{
      height: 40px;
      width: 100px;
    }
  </style>
</head>

<body>
  <h1>输入验证码</h1>
  <div id="confirm">
    <input type="text" name="inputCaptcha" id="inputCaptcha">
    <img id="verificationCodeImg" src="/admin/captcha" style="cursor: pointer;" title="看不清？换一张" />
    <input type="button" value="提交" id="checkCaptcha">
  </div>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
  <script>
    
    $("#verificationCodeImg").click(function(){
      $(this).hide().attr('src', '/admin/captcha?dt=' + new Date().getTime()).fadeIn();
    });

    $("#checkCaptcha").click(function () {
      $.ajax({
        url: "/admin/check",
        type: "get",
        data: { captcha: $("#inputCaptcha").val() },
        success: function (result) {
          if (result) {
            location.href = "success.html";
          } else {
            alert("验证码错误");
            $("#inputCaptcha").val("");
          }
        }
      });
    });
  </script>
</body>

</html>

success.html代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>验证成功页</title>
</head>
<body>
    <h1>验证成功</h1>
</body>
</html>

🌴约定前后端交互接⼝

🚩需求分析

界⾯如下图所⽰

  1. ⻚⾯⽣成验证码

  2. 输⼊验证码,点击提交,验证⽤⼾输⼊验证码是否正确,正确则进⾏⻚⾯跳转
    在这里插入图片描述
    在这里插入图片描述

后端需要提供两个服务

  1. ⽣成验证码,并返回验证码

  2. 校验验证码是否正确:校验验证码是否正确

🚩接⼝定义

接口一：⽣成验证码

请求：

GET /admin/captcha

响应：图片内容

浏览器给服务器发送⼀个 GET /admin/captcha 这样的请求,服务器返回⼀个图⽚,浏览器显⽰在⻚⾯上

接口二：校验验证码是否正确

请求:/admin/check

POST /admin/check
captcha=xn8d

captcha:⽤⼾输⼊的验证码

响应：

true

根据⽤⼾输⼊的验证码,校验验证码是否正确true:验证成功.false:验证失败

🚩实现服务器后端代码

我们分为三步完成

第一步引入依赖，上面已讲过了，直接引入就好

第二步通过配置创建验证码⽣成器

配置如下：

kaptcha:
 image:
  width: 200
  height: 50
 textproducer:
  font:
   size: 40
 items:
  home:
   path: /admin/captcha
   session:
    key: KAPTCHA_SESSION_KEY
    date: KAPTCHA_SESSION_DATE

第三步，验证码校验

这里我们需要根据前端传回来的验证码与服务器session中取得值做一个比对

除此之外我还添加了验证码为null时，返回false。以及一个验证码得时效性，当超过一定时间，该验证码就不能够再进行验证了，返回false

代码实现如下：

@RequestMapping("/admin")
@RestController
public class KaptchaController {
    //设置时间问60s
    private final static long VALID_MILLIS_TIME = 60 * 1000;
    @RequestMapping("/check")
    public boolean checkHomeCaptcha(String captcha, HttpSession session) {
        if (!StringUtils.hasLength(captcha)) {
            return false;
        }
        //获取验证码
        String savedCaptcha = (String) session.getAttribute(Constants.KAPTCHA_SESSION_KEY);
        //获取验证生成时间
        Date sessionDate = (Date) session.getAttribute(Constants.KAPTCHA_SESSION_DATE);
        if (captcha.equalsIgnoreCase(savedCaptcha)) {
            if (sessionDate == null || System.currentTimeMillis() - sessionDate.getTime() < VALID_MILLIS_TIME)
                return true;
        }
        return false;
    }
}

注意事项：
在这里插入图片描述
在这里插入图片描述

⭕总结

关于《【JavaEE进阶】实现验证码》就讲解到这儿，感谢大家的支持，欢迎各位留言交流以及批评指正，如果文章对您有帮助或者觉得作者写的还不错可以点一下关注，点赞，收藏支持一下！

遇事问春风乄
关注
  • 31
    点赞
  • 踩
  • 27
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 10
    评论
专栏目录
Java资源 Java学习资料 JavaEE初阶和JavaEE进阶知识
06-21
【Java】资源 Java学习资料 JavaEE初阶和JavaEE进阶知识
JavaEE进阶面试总结.xmind
09-12
JavaEE进阶面试总结
Java实现验证码功能
2301_77042303的博客
04-23 4846
验证码一般用于登陆界面的防机器验证，但自已写一个验证码组件较为麻烦，我们可以用ValidateCode组件来实现，以下通过两个示例来演示ValidateCode的用法，最后附jar包，可自行下载。生成验证码，调用该方法可以重新生成验证码，实例化对象时会自动调用该方法生成一个默认的验证码，后续可再次调用生成。实例化对象，指定宽度和高度，默认验证码位数为5为位，障碍线为150；实例化对象，指定宽度、高度、验证码位数、障碍线数量；将生成的验证码图像写入输出流对象，可用于web端。
Java验证码
Shawn的个人博客
03-04 2943
验证码（CAPTCHA）是“Completely Automated Public Turing test to tell Computers and Humans Apart”（全自动区分计算机和人类的图灵测试）的缩写，是一种区分用户是计算机还是人的公共全自动程序验证码的作用：防止刷票、论坛灌水、刷页防止黑客恶意破解密码，盗取用户数据验证码通常使用一些线条和一些不规则的字符组成，主要作用是为了防止一些黑客把密码数据化盗取。
Java 验证码生成的两种方式【开箱即用】
最新发布
qq_43108153的博客
03-06 828
验证码生成的两种方式
JAVA—生成验证码的两种方法（代码+运行结果+总结）
热门推荐
m0_61120771的博客
03-25 2万+
系列文章目录 提示：这里可以添加系列文章的所有文章的目录，目录需要自己手动添加 例如：第一章 Python 机器学习入门之pandas的使用 提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录 系列文章目录 前言 一、pandas是什么？ 二、使用步骤 1.引入库 2.读入数据 总结 前言 提示：这里可以添加本文要记录的大概内容： 例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的
Java实现生成和校验图片验证码(详细)
weixin_47390965的博客
09-08 1万+
验证码校验是日常中很常见的场景，工作中难免会遇到了生成和校验验证码这样的需求，可以用Hutool工具类； hutool生成图片验证码的核心接口是ICaptcha，此接口定义了以下方法： createCode 创建验证码，实现类需同时生成随机验证码字符串和验证码图片 getCode 获取验证码的文字内容 verify 验证验证码是否正确，建议忽略大小写 write 将验证码写出到目标流中
使用Java实现动态验证码的示例代码,你值得拥有
qq_28245087的博客
06-15 1万+
本文将介绍如何使用Java实现动态验证码。动态验证码是一种常用的安全验证方式，可以有效地防止恶意攻击和机器人攻击，保护用户数据的安全性。动态验证码是一种常用的安全验证方式，可以有效地提高系统的安全性。本文介绍了如何使用Java实现动态验证码，并提供了示例代码和性能分析。在实际应用中，可以根据需求选择合适的验证码生成算法和验证码长度，以提高系统的安全性和性能。
JavaEE进阶教程 大学生毕业设计教学，4天全项目实战
03-11
JavaEE进阶教程 大学生毕业设计教学，4天全项目实战
JavaEE进阶(29) JDBC连接数据库实现增删改查(使用Dao层实现)-附件资源
03-02
JavaEE进阶(29) JDBC连接数据库实现增删改查(使用Dao层实现)-附件资源
JavaEE进阶教程 大学生毕业设计教学辅助系统，4天全项
03-30
02_老师登录之后分页查看视频信息—代码实现mp4 0 4_老师删除视频_代码实现・m p4 0 5_上传视频—页面跳转・m p4 0 3_删除视频原理分析・m p4 20—过滤器实现mp4 01_老师登录之后分页查看视频信息.mp4 19_过滤器验证...
用Java简单实现验证码功能以及校验
零零年代的风的博客
05-06 2313
目录结构 流程图 LoginServlet package com.itheima.web.servlet.session; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.h
Java实现验证码
Chao_King
03-16 1698
1、验证码由什么组成的？ 答：验证码是有一张图片组成的，然后在向图片中打印几个字母或数字，其字母或数字可以个性化设置。 第一步： 创建验证码所显示的内容、字体选择和字体大小选择，还有一个随机对象以便于产生随机验证码。 private final String str[] = {"1","2","3","4","5","6"}; private final String[] fontName = {"宋体","华文楷体","黑体","华文新魏","华文隶书","微软雅黑"}; priv
用Java制作登录验证码
LoweTvT的博客
08-14 1019
/ 随机生成一个97~122的数字，然后强转为小写字母。2.用Random方法随机出0,1,2三个数字,0代表数字，1代表大写字母，2代表小写字母.// 随机生成一个65~90的数字，然后强转为大写字母。// 确定字符类型(0代表数字，1代表大写字母，2代表小写字母)1.定义一个方法，生成验证码返回，方法参数为int，返回值类型为String.// 调用Code方法，并给定验证码长度。
java实现图片验证码全套实现方式
起而行动，方能平定心中的惶恐
05-05 2万+
##百度网盘demo提取地址: https://pan.baidu.com/s/1dF81khNhttps://github.com/rundreamstop/graphic-validate-code##java引用的包 ##控制器代码 ##CaptchaFactory实现代码
java实现简单的验证码
weixin_50369190的博客
04-06 3795
java实现简单的验证码案例
Java实现图形验证码
m0_50281408的博客
11-01 2378
本文生成图像验证码使用了Hutool官网 — 🍬A set of tools that keep Java sweet.图形验证码是一种用于验证用户身份的安全措施。它通过生成一张包含随机图像和文字的图片，要求用户进行识别并输入正确信息来证明其为真实用户而非计算机程序。旨在防止恶意行为，例如批量注册、登录、灌水等，以提高网站的安全性。图形验证码通常会包含随机生成的数字、字母或符号，并且还会加入一些干扰元素，如曲线、噪点或干扰线，以增加识别难度。
javaee如何实现分页功能?
05-26
JavaEE 中实现分页功能通常有两种方式： 1. 使用 SQL 语句中的 LIMIT 子句 在 SQL 语句中使用 LIMIT 子句可以限制返回的记录数，从而实现分页功能。例如： ```sql SELECT * FROM table_name LIMIT start_index, page_size; ``` 其中，`start_index` 表示从哪一条记录开始返回，`page_size` 表示每页返回的记录数。 2. 使用 JavaEE 框架提供的分页工具 JavaEE 框架中常见的分页工具有 MyBatis、Hibernate 等。这些框架提供了分页插件或 API，可以方便地实现分页功能。以 MyBatis 为例，可以通过配置 XML 文件和 Java 代码来实现分页功能。例如： 在 XML 文件中配置分页参数： ```xml <select id="selectByPage" resultMap="BaseResultMap"> select * from table_name </select> ``` 在 Java 代码中调用分页方法： ```java PageHelper.startPage(pageNum, pageSize); List<YourEntity> list = yourMapper.selectByPage(); PageInfo<YourEntity> pageInfo = new PageInfo<>(list); ``` 其中，`pageNum` 表示当前页码，`pageSize` 表示每页返回的记录数。`PageHelper.startPage(pageNum, pageSize)` 方法会自动在 SQL 语句中添加 LIMIT 子句，从而实现分页功能。`PageInfo` 对象包含了分页相关的信息，例如总记录数、总页数等。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 10
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

遇事问春风乄

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值