【spring boot 实现图片验证码 前后端】

导入hutool依赖

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

获取验证码接口

    @Autowiredprivate Captcha captcha;private final static Long VALIDATE_CODE = 60 * 1000L;@RequestMapping("/getCaptcha")public void getCaptcha(HttpServletResponse response, HttpSession session) throws IOException {// 设置响应内容类型response.setContentType("image/png");// 直接把验证码写入浏览器,没有返回值LineCaptcha lineCaptcha = CaptchaUtil.createLineCaptcha(captcha.getWidth(), captcha.getHeight(),4,4);String code = lineCaptcha.getCode();session.setAttribute(captcha.getSession().getKey(), code);session.setAttribute(captcha.getSession().getDate(),new Date());// 获取当前时间lineCaptcha.write(response.getOutputStream());}

检查验证码接口

    @RequestMapping("/check")public boolean check(String mycaptcha, HttpSession session) {System.out.println("[captchaCheck]用户输入的验证码:" + mycaptcha);String code = (String)session.getAttribute(captcha.getSession().getKey());if(!StringUtils.hasLength(code)) {return false;}Date date = (Date)session.getAttribute(captcha.getSession().getDate());if(mycaptcha.equalsIgnoreCase(code) && VALIDATE_CODE >= System.currentTimeMillis() - date.getTime()) {return true;}return false;}

前后端交互

<img id="captcha_img" src="/captcha/getCaptcha" alt="看不清?换一张" onclick="change()">
let check = false;function change() {event.preventDefault();  // 阻止表单默认提交行为$.ajax({type: "get",url: "/captcha/getCaptcha",success: function (result) {console.log("[getCaptcha]刷新的验证码:" + result);$("#captcha_img").attr("src", "/captcha/getCaptcha");}})}function login() {event.preventDefault();  // 阻止表单默认提交行为$.ajax({type: "get",url: "/login",data: {username: $("#username").val(),password: $("#password").val(),},success: function (result) {console.log(result);if(result === false) {alert("用户名或密码错误!!");}else if(result === true && check === false) {alert("验证码错误!!");location.reload();}else if(result === true && check === true) {location.href = "recognize.html";}// if(result === true && check === true) {//     location.href = "recognize.html";// }// else {//     alert("用户名或密码错误!!");// }}})$.ajax({type: "post",url: "/captcha/check",data: {mycaptcha: $("#captcha").val() },success: function (result) {console.log(result);if(result === false) {check = false;// alert("验证码错误!!");// location.reload();}  else {check = true;}}})}

测试

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/35187.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

arthas基础命令

文章目录 1. help2. cat3. grep4. pwd5. cls6. session7. reset8. version9. history10. quit11. stop12. keymapArthas 命令行快捷键后台异步命令相关快捷键小结 1. help 作用&#xff1a;查看命令帮助信息 2. cat 作用&#xff1a;打印文件内容&#xff0c;和linux里的cat命…

痉挛性斜颈护理宝典:重拾生活平衡

痉挛性斜颈会给患者的生活带来诸多不便&#xff0c;有效的健康护理对缓解症状、提升生活质量十分关键。 在日常活动方面&#xff0c;患者应保持正确的姿势。站立和坐姿要挺直脊背&#xff0c;避免长时间低头或歪头&#xff0c;减少颈部肌肉的额外负担。睡眠时&#xff0c;选择高…

虚拟定位 1.2.0.2 | 虚拟定位,上班打卡,校园跑步模拟

Fake Location是一款运行于安卓平台上的功能强大、简单实用的虚拟定位软件。它能够帮助用户自定义位置到地图上的任意地方&#xff0c;以ROOT环境运行不易被检测&#xff0c;同时也支持免ROOT运行。提供路线模拟、步频模拟、WIFI模拟等方式&#xff0c;支持反检测。 大小&…

C++基础 [五] - String的模拟实现

目录 前言 string类的模拟实现 成员函数的实现 构造函数 拷贝构造函数 赋值运算符重载 析构函数 元素访问的实现 operator[ ] Iterator - 迭代器 容量大小的实现 size capacity reserve ​编辑resize 内容修改的实现 push_back append operator(char ch) …

嵌入式硬件--开发工具-AD使用常用操作

ad16.1.12 1.如何显示/隐藏其他图层 在pcb界面点击L--试图界面中找到“视图选项”--单层模式选择 not in single layer mode 在pcb界面点击L--试图界面中找到“视图选项”--单层模式选择 gray scale other layers 【Altium】AD如何只显示一层&#xff0c;隐藏其他层显示&…

浏览器好用的去广告插件和暗黑模式护眼插件

提升浏览体验&#xff1a;Edge浏览器的Adblock和Dark Mode扩展 Adblock&#xff1a;告别广告干扰 功能&#xff1a;高效拦截弹窗、横幅和视频广告&#xff0c;提升网页整洁度&#xff0c;加快加载速度&#xff0c;节省流量。安装链接&#xff1a;安装Adblock Dark Mode for E…

MySQL-基础篇

从数据库的基础的概念特性到数据库当中的SQL语句&#xff0c;再到数据库当中的存储引擎、索引优化以及分库分表、数据库的集群&#xff0c;甚至于数据库的底层原理 MySQL概述SQL函数约束多表查询事务 这块由于上学期学过一些就速过。 MySQL概述 通过SQL就可以操作数据库管理…

fastapi+angular外卖系统

说明&#xff1a; fastapiangular外卖系统 1.美食分类&#xff08;粥&#xff0c;粉&#xff0c;面&#xff0c;炸鸡&#xff0c;炒菜&#xff0c;西餐&#xff0c;奶茶等等&#xff09; 2.商家列表 &#xff08;kfc&#xff0c;兰州拉面&#xff0c;湘菜馆&#xff0c;早餐店…

2025高频面试算法总结篇【递归回溯动态规划】

文章目录 递归&回溯131. 分割回文串面试题 08.12. 八皇后 动态规划72编辑距离5. 最长回文子串279. 完全平方数300. 最长递增子序列139. 单词拆分 递归&回溯 131. 分割回文串 回溯思路&#xff1a; 临界条件&#xff1a; if (start s.length) > 保存 循环遍历这个…

Ubuntu docker安装milvusdb

一、安装docker 1.更新软件包 sudo apt update sudo apt upgrade sudo apt-get install docker-ce docker-ce-cli containerd.io查看是否安装成功 docker -v二、使用国内的镜像下载 milvusdb Docker中国区官方镜像: https://registry.docker-cn.com milvusdb/milvus - Doc…

Redis如何实现持久化

Redis如何实现持久化 Redis默认将所有数据存储在内存中&#xff0c;虽然读写效率极高&#xff0c;但存在两大风险 数据易失性&#xff1a;进程重启或服务器宕机导致内存数据丢失。恢复成本高&#xff1a;无法直接通过内存重建大规模数据集。 Redis作为高性能的键值数据库&…

DeepSeek进阶应用(二):结合Kimi制作PPT(双AI协作教程)

&#x1f31f;引言&#xff1a; DeepSeek作为国产AI大模型&#xff0c;以强大的逻辑推理和结构化内容生成能力著称&#xff0c;擅长根据用户需求生成PPT大纲或Markdown文本&#xff1b;Kimi的PPT助手则能解析结构化内容并套用模板快速生成美观的PPT&#xff0c;两者结合实现“内…

查看分析日志文件、root密码不记得了,那应该怎么解决这些问题

下面我来讲解一下概念以及应该怎么做&#xff1a; 查看分析日志文件 一、主要日志文件 ♣ 内核及系统日志&#xff1a;这种日志数据由系统服务rsyslog统一管理&#xff0c;根据其主配置文件 /etc/rsyslog.conf 中的设置决定将内核消息及各种系统程序信息记录到什么位置。系统中…

mac电脑如何将wps接入deepseek (傻瓜式教学)

我的是mac pro m4 pro版本,版本不同页面或许有些许差异 首先将wps更新到最新的版本,并打开,点击 + 号 新建一个word文档 点击空白文档 点击开发工具,如果没有开发工具,可以先点击工具,在里面找到开发工具,然后点击宏安全性,设置为低,如下图所示

SpringMVC(五)拦截器

目录 拦截器基本概念 一 单个拦截器的执行 1 创建拦截器 2 SpringMVC配置&#xff0c;并指定拦截路径。 3 运行结果展示&#xff1a; 二 多个拦截器的执行顺序 三 拦截器与过滤器的区别 拦截器基本概念 SpringMVC内置拦截器机制&#xff0c;允许在请求被目标方法处理的…

3.17[A]CV

在计算机图形学中&#xff0c;反走样&#xff08;Antialiasing&#xff09; 是一种用于减少图像中锯齿状边缘&#xff08;aliasing artifacts&#xff09;的技术。当绘制曲线或图形时&#xff0c;由于像素的离散性&#xff0c;曲线边缘可能会出现锯齿状的失真。反走样通过考虑曲…

集成学习(上):Bagging集成方法

一、什么是集成学习&#xff1f; 在机器学习的世界里&#xff0c;没有哪个模型是完美无缺的。就像古希腊神话中的"盲人摸象"&#xff0c;单个模型往往只能捕捉到数据特征的某个侧面。但当我们把多个模型的智慧集合起来&#xff0c;就能像拼图一样还原出完整的真相&a…

【LangChain】理论及应用实战(5):Agent

文章目录 一、基本介绍1.1 Agent介绍1.2 Agent示例 二、几种主要的Agent类型2.1 ZERO_SHOT_REACT_DESCRIPTION2.2 CHAT_ZERO_SHOT_REACT_DESCRIPTION2.3 CONVERSATIONAL_REACT_DESCRIPTION2.4 CHAT_CONVERSATIONAL_REACT_DESCRIPTION2.5 OPENAI_FUNCTIONS 三、给Agent增加Memor…

口袋书签系统:AI 智能生成分类描述,省时又高效

口袋书签一键触达&#xff0c;免费使用&#xff1a;https://navfinder.cn/ 口袋书签系统新增了“根据收藏站点&#xff0c;AI自动生成分类描述”的功能&#xff0c;简要说明如下&#xff1a; 自动分析站点信息 系统会根据用户当前分类中的站点标题、标签等信息&#xff0c;结合…

AtCoder Beginner Contest 397 A - D题解

Tasks - OMRON Corporation Programming Contest 2025 (AtCoder Beginner Contest 397) 本文为 AtCoder Beginner Contest 397 A - D题解 题目A: 代码(C): #include <bits/stdc.h>int main() {double n;std::cin >> n;if (n > 38.0) {std::cout << 1;}…