HuTool图案验证码

最新推荐文章于 2024-05-31 14:02:53 发布

@yiyi123

最新推荐文章于 2024-05-31 14:02:53 发布

阅读量245

点赞数

分类专栏： JavaEE project 前端文章标签： java

本文链接：https://blog.csdn.net/qq_51866806/article/details/132292006

版权

JavaEE 同时被 3 个专栏收录

16 篇文章 0 订阅

订阅专栏

project

4 篇文章 0 订阅

订阅专栏

前端

2 篇文章 0 订阅

订阅专栏

HuTool

在登录时进行验证码验证，增加系统安全,hutool是Java工具类库，提供了各种组件和工具类，Hutool官网地址：https://hutool.cn/docs/#/

1.使用HuTool工具类首先引入依赖

    <dependency>
          <groupId>cn.hutool</groupId>
          <artifactId>hutool-all</artifactId>
          <version>5.8.16</version>
    </dependency>

2.生成图案验证码

   /************************验证码：hutool类库******************************************************/
  @RequestMapping("/user")
   class Test{
   		 @RequestMapping("/getcode")
    	public void getCode(HttpServletResponse response) {

        	// 随机生成 4 位验证码，范围是0-9
        	randomGenerator = new RandomGenerator("0123456789", 4);
        	// 定义图片的显示大小
        	LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(95, 30);
        	response.setContentType("image/jpeg");
        	response.setHeader("Pragma", "No-cache");
        	try {
            	// 调用父类的 setGenerator() 方法，设置验证码的类型
            	lineCaptcha.setGenerator(randomGenerator);
            	// 输出到页面
            	lineCaptcha.write(response.getOutputStream());
            	// 打印验证码
           	 	String code = lineCaptcha.getCode();
            	System.out.println("生成的验证码:"+code);;
            	// 关闭流
            	response.getOutputStream().close();
        	} catch (IOException e) {
            	e.printStackTrace();
        	}
    	}
   }

3.前端引入验证码

   <div class="code">
             <span>验证码</span>
             <input type="text" id="getCode">
             <!-- 将/user/getcode请求接口生成的验证码输出到当前页面 -->
             <img  src="/user/getcode" id="codeImg" onclick="refresh()" alt="">
   </div>


    /* javascrip刷新验证码 */
    function refresh() {
     /* new Date().getTime()这里采取获得时间，使每次点击图片验证码时src发生改变，前端检测到src改变时，就会根据接口自动去重新获得图片验证码 */
      document.querySelector("#codeImg").src = "user/getcode?time=" + new Date().getTime();
    }