springboot验证码生成以及验证功能举例详解

2024-08-02 02:40:28

1.easy-captcha工具包

生成验证码的方式有许多种，这里选择的是easy-captcha工具包。

其支持Java图形验证码，支持gif、中文、算术等类型，可用于Java Web、JavaSE等项目。

2添加依赖

首先需要将easy-captcha的依赖配置文件增加到pom.xml文件中。

开源项目中已经写好了导入依赖语句复制粘贴过去即可。

   <dependency>
      <groupId>com.github.whvcse</groupId>
      <artifactId>easy-captcha</artifactId>
      <version>1.6.2</version>
   </dependency>

3.验证码字符类型

使用方法：

//生成验证码对象
SpecCaptcha captcha = new SpecCaptcha(130, 48, 5);
//设置验证码的字符类型
captcha.setCharType(Captcha.TYPE_ONLY_NUMBER);

4.字体设置

如果不想使用内置字体也可以使用系统字体。使用方法如下：

//生成验证码对象
SpecCaptcha captcha = new SpecCaptcha(130, 48, 5);

// 设置内置字体
captcha.setFont(Captcha.FONT_1); 

// 设置系统字体
captcha.setFont(new Font("楷体", Font.PLAIN, 28));

5验证码图片输出

这里可以选择输出为文件流，这是比较常见的处理方式。当然，也有一些Web项目会使用base64编码的图片。这两种方式easy-captcha都支持。
base64编码的输出方法如下所示：

SpecCaptcha specCaptcha = new SpecCaptcha(130, 48, 5);
specCaptcha.toBase64();

// 如果不想要base64的头部data:image/png;base64,
specCaptcha.toBase64("");  // 加一个空的参数即可

输出到磁盘上的方法如下所示：

FileOutputStream outputStream = new FileOutputStream(new File("C:/captcha.png"))
SpecCaptcha specCaptcha = new SpecCaptcha(130, 48, 5);
specCaptcha.out(outputStream);

该段代码为生成一张图片并保存到磁盘目录中，这里可以使用easy-captcha工具自带的out()方法输出。而在开发Web项目时，则会使用Response对象的输出流进行验证码的输出。

6.生成并显示验证码

6.1后端

在controller包中新建KaptchaController类，就可以新建一个方法。在方法里使用GifCaptcha可以生成一个PNG类型的验证码对象，并以图片流的方式输出到前端以供显示，代码如下所示：

@Controller
public class KaptchaController {
    @GetMapping("/kaptcha")
    public void defaultKaptcha(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse) throws Exception{
        httpServletResponse.setHeader("Cache-Control","no-store");
        httpServletResponse.setHeader("Pragma","no-cache");
        httpServletResponse.setDateHeader("Expires",0);
        httpServletResponse.setContentType("image/gif");

        //生成验证码对象,三个参数分别是宽、高、位数
        SpecCaptcha captcha = new SpecCaptcha(130, 48, 5);
        //设置验证码的字符类型为数字和字母混合
        captcha.setCharType(Captcha.TYPE_DEFAULT);
        // 设置内置字体
        captcha.setCharType(Captcha.FONT_1);
        //验证码存入session
        httpServletRequest.getSession().setAttribute("verifyCode",captcha.text().toLowerCase());
        //输出图片流
        captcha.out(httpServletResponse.getOutputStream());
    }
}

这里在控制器中新增了defaultKaptcha()方法，该方法所拦截处理的路径为/kaptcha。在前端访问该路径后就可以接收一个图片流并显示在浏览器页面上。

6.2前端

在static目录中新建kaptcha.html页面，在该页面中显示验证码，代码如下所示：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>验证码显示</title>
</head>
<body>
<img src="/kaptcha" onclick="this.src='/kaptcha?d='+new Date()*1" />
</body>
</html>

首先访问后端验证码路径/kaptcha，由于验证码是图片形式，所以将其显示在img标签中。然后定义onclick方法，在点击该img标签时可以动态切换显示一个新的验证码。点击时访问的路径为’/kaptcha?d='+new Date()*1，即原来的验证码路径后面带上一个时间戳参数d。时间戳是会变化的，所以每次点击都会是一个与之前不同的请求。如果不这样处理的话，由于浏览器的缓存机制，在点击刷新验证码后可能不会重新发送请求，将导致在一段时间内一直显示同一张验证码图片。

在编码完成后，启动Spring Boot项目。在启动成功后打开浏览器并输入验证码显示的测试页面地址

http://localhost:8080/kaptcha

效果如下：

7 验证码的输入验证

一般的做法是在后端生成验证码后，首先对当前生成的验证码内容进行保存，可以选择保存在session对象中，或者保存在缓存中，或者保存在数据库中。然后，返回验证码图片并显示到前端页面。用户在识别验证码后，在页面对应的输入框中填写验证码并向后端发送请求，后端在接到请求后会对用户输入的验证码进行验证。如果用户输入的验证码与之前保存的验证码不相等的话，则返回“验证码错误”的提示消息且不会进行后续的流程，只有验证成功才会继续后续的流程。

7.1后端

在KaptchaController类中新增verify()方法，代码如下所示：

    public String verify(@RequestParam("code") String code, HttpSession session){
        if (!StringUtils.hasLength(code)){
            return "验证码不能为空";
        }
        String kaptchaCode = session.getAttribute("verifyCode")+"";
        if (!StringUtils.hasLength(kaptchaCode)||!code.toLowerCase().equals(kaptchaCode)){
            return "验证码错误";
        }
        return "验证成功";
    }

该方法所拦截处理的路径为/verify，请求参数为code，即用户输入的验证码。在进行基本的非空验证后，与之前保存在session中的verifyCode值进行比较，如果两个字符串不相等则返回“验证码错误”的提示，二者相同则返回“验证码成功”的提示。

7.2前端

在static目录中新建verify.html，该页面会显示验证码，同时也包含供用户输入验证码的输入框和提交按钮，代码如下所示：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>验证码测试</title>
</head>
<body>
<img src="/kaptcha" onclick="this.src='/kaptcha?d='+new Date()*1" />
<br>
<input type="text" maxlength="5" id="code" placeholder="请输入验证码" />
<button id="verify">验证</button>
<br>
<p id="verifyResult">
</p>
</body>
<!--jqGrid依赖jQuery,因此需要先引入jquery.min.js文件，下方地址为字节跳动提供的cdn地址-->
<script src="http://s3.pstatp.com/cdn/expire-1-M/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
    //验证按钮的点击事件
        $('#verify').click(function () {
            var code = $('#code').val();
            $.ajax({
                type: 'GET',//方法类型
                url: '/verify?code='+code,
                success: function (result) {
                //将验证结果显示在p标签中
                    $('#verifyResult').html(result);
                },
                error:function () {
                    alert('请求失败');
                },
            });
        });
    });
</script>
</html>

用户识别显示在页面上的验证码后，就可以在input框中输入验证码并点击“验证”按钮。在JS代码中已经定义了“验证”按钮的点击事件，一旦点击，就会获取用户在输入框中输入的内容，并将其作为请求参数向后端发送请求，验证用户输入的验证码是否正确，后端在处理完成后会返回处理结果，拿到处理结果就显示在id为verifyResult的p标签中。

总结

到此这篇关于springboot验证码生成以及验证功能的文章就介绍到这了,更多相关springboot验证码生成及验证内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

springboot控制层图片验证码生成

本次博客记录项目中一个图片验证码的实现,虽然不是很复杂,但好记性不如烂笔头,谨记! package com.zl.util; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; import java.awt.image.BufferedImage; import java.io.FileOutputStream; import java.io.IOException; import java.io.Out
Spring Boot 验证码的生成和验证详解

前言本文介绍的imagecode方法是一个生成图形验证码的请求,checkcode方法实现了对这个图形验证码的验证.从验证码的生成到验证的过程中,验证码是通过Session来保存的,并且设定一个验证码的最长有效时间为5分钟.验证码的生成规则是从0~9的数字中,随机产生一个4位数,并增加一些干扰元素,最终组合成为一个图形输出 1.验证码生成类 import java.awt.*; import java.awt.image.BufferedImage; import java.io.Output
SpringBoot实现前端验证码图片生成和校验

SpringBoot下实现前端验证码图片的生成和校验,供大家参考,具体内容如下 1.效果点击验证码可以获取新的验证码 2.原理后台生成验证码图片,将图片传到前台. 后台在session中保存验证码内容. 前台输入验证码后传到后台在后台取出session中保存的验证码进行校验. 注意,验证码的明文是不能传送到前端的.前端内容都是透明的,不安全.验证码是用来防机器人并不是单单防人.如果把验证码明文传到前端很容易就会被破解. 3.图片生成验证码生成工具类RandomValidateCodeUti
SpringBoot 图形验证码的生成和校验

1. 编写工具类 package com.cn.beauty.util; import org.slf4j.Logger; import org.slf4j.LoggerFactory; import javax.imageio.ImageIO; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSes
Spring boot如何集成kaptcha并生成验证码

kaptcha是一个开源的验证码实现库 1.添加依赖 <dependency> <groupId>com.github.axet</groupId> <artifactId>kaptcha</artifactId> <version>0.0.9</version> </dependency> 2.添加配置类配置验证码的生成属性 package com.dream.road.config; import com
SpringBoot使用Captcha生成验证码

1. 基本结构使用Captcha生成验证码, 利用Redis存储验证码 Redis中的结构为, Key是32位的UUID, Value为Captcha的4位随机字母以及数字的集合设定Redis过期时间为1min, 即可实现过期验证码的自动失效 2. Kaptcha的依赖基本的依赖这里不再叙述, 主要说一下要导入Captcha的依赖  <dependency> <groupId>com.github.penggle</groupId
SpringBoot实现Thymeleaf验证码生成

使用后台返回验证码图片,验证码存到session中后端实现校验,前端只展示验证码图片. 本篇用SpringBoot Thymeleaf实现验证码生成. 创建springboot项目引入依赖完整pom.xml <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http
springboot整合kaptcha生成验证码功能

介绍:kaptcha 是谷歌开源的非常实用的验证码生成工具一.导入jar包  <dependency> <groupId>com.github.penggle</groupId> <artifactId>kaptcha</artifactId> <version>2.3.2</version> </dependency> 二.编写kaptcha配置类 pack
springboot验证码的生成与验证的两种方法

目录前言效果一览(单击图片刷新验证码) 一.使用整合kaptcha方式实现验证码生成与验证二.使用hutool-captcha方式实现验证码生成与验证前言在springboot的登陆页面中为了防止机器大规模注册,机器暴力破解数据密码等危害,需要验证随机生成的验证码.现提出两种简易方案生成验证码功能,一种采用springboot整合kaptcha第三方验证码生成工具的生成方案:另一种采用springboot整合第三方类库hutool生成验证码,验证成功跳转至success页面,失败则跳转
springboot验证码生成以及验证功能举例详解

目录 1.easy-captcha工具包 2添加依赖 3.验证码字符类型 4.字体设置 5验证码图片输出 6.生成并显示验证码 6.1后端 6.2前端 7 验证码的输入验证 7.1后端 7.2前端总结 1.easy-captcha工具包生成验证码的方式有许多种,这里选择的是easy-captcha工具包. github开原地址为:easy-captcha工具包其支持Java图形验证码,支持gif.中文.算术等类型,可用于Java Web.JavaSE等项目. 2添加依赖首先需要将easy
Springboot Vue实现单点登陆功能示例详解

目录正文简单上个图先分析下登陆要做啥怎么落实? 上代码接口: token生成部分刷新token 验证token 正文登陆是系统最基础的功能之一.这么长时间了,一直在写业务,这个基础功能反而没怎么好好研究,都忘差不多了.今天没事儿就来撸一下. 以目前在接触和学习的一个开源系统为例,来分析一下登陆该怎么做.代码的话我就直接CV了. 简单上个图 (有水印.因为穷所以没开会员) 先分析下登陆要做啥首先,搞清楚要做什么. 登陆了,系统就知道这是谁,他有什么权限,可以给他开放些什么业务功能,
AngularJS自定义表单验证功能实例详解

本文实例讲述了AngularJS自定义表单验证功能.分享给大家供大家参考,具体如下: Angular实现了大部分常用的HTML5的表单控件的类型(text, number, url, email, date, radio, checkbox),也实现了很多指令做为验证(required, pattern, minlength, maxlength, min, max). 在自定义的指令中,我们可以添加我们的验证方法到ngModelController的$validators对象上.为了取得这个c
AngularJS学习笔记之表单验证功能实例详解

本文实例讲述了AngularJS学习笔记之表单验证功能.分享给大家供大家参考,具体如下: 一.执行基本的表单验证 <!DOCTYPE html> <html ng-app='exampleApp'> <head> <meta charset="UTF-8"> <title>表单</title> <script src="../../js/angular.min.js" type="
SpringBoot实现WEB的常用功能案例详解

目录前言 SpringMVC整合支持 Spring MVC自动配置项目基础环境搭建功能扩展实现 Spring MVC功能扩展实现 Spring整合Servlet三大组件使用注册方式整合使用组件注册方式整合Servlet 使用组件注册方式整合Filter 使用组件注册方式整合 Listener 文件上传与下载文件上传编写上传表单界面编写控制器文件下载添加依赖下载处理控制器编写前端代码 SpringBoot的打包部署 jar包形式打包启动jar包 war包形式打包 war包
jQuery+ajax实现修改密码验证功能实例详解

废话不多说了,直接给大家贴代码了,具体代码如下所示: <script type="text/JavaScript"> //获取url中的参数 $(function(){ var userName = window.location.href; var aa = userName.indexOf("="); console.log(userName); if (aa == -1) return ""; userName=userName
SpringBoot 集成Kaptcha实现验证码功能实例详解

在一个web应用中验证码是一个常见的元素.不管是防止机器人还是爬虫都有一定的作用,我们是自己编写生产验证码的工具类,也可以使用一些比较方便的验证码工具.在网上收集一些资料之后,今天给大家介绍一下kaptcha的和springboot一起使用的简单例子. 准备工作: 1.你要有一个springboot的hello world的工程,并能正常运行. 2.导入kaptcha的maven: <!-- https://mvnrepository.com/artifact/com.github.penggl
JavaScript生成验证码并实现验证功能

废话不多说了,直接给大家贴代码了,具体代码如下所示: <html> <head> <title>验证码</title> <style type="text/css"> #code { font-family:Arial; font-style:italic; font-weight:bold; border:0; letter-spacing:2px; color:blue; } </style> <scri
PHP 用session与gd库实现简单验证码生成与验证的类方法

验证码是为了防止机器灌水给网站带来污染以及增加服务器负担而出现的.目前大大小小的网站都有验证码.今天自己实现了一个简单的验证码类.说简单是因为没有加一些干扰的弧线等等,只是将文字旋转了一下.当然,因为字体的原因,要想一眼看出来并不容易.同时,为了避免字母的大小写与数字混淆,又去掉了那些看起来很像的字母数字. 类: <?php /** *简单生成验证码类 */ class Captcha { private $width;//验证码宽度 private $height;//验证码高度 privat
phpcms实现验证码替换及phpcms实现全站搜索功能教程详解

在使用phpcms替换网页的时候,除了正常的替换栏目.内容页等,其他的什么验证码啦,提交表单了,搜索功能了,这些在替换的时候可能会对一些默认文件有一些小小的改变下面就是自己在失败中成功的过程,最后终于替换成没有bug的替换一.phpcms的验证码替换有验证码的地方,一般就是表单了,那么首先就要先制作表单出来了,表单的制作过程很简单,如下: A.制作一张表单出来 (1)登录自己的phpcms后台管理 (2)登录进去后,按照这个步骤进行添加表单 a.模块------表单向导:如图 b.打开表