网站观赏,网站建设 腾,wordpress如何上线,百度权重查询网站目
#x1f332;实现说明
#x1f384;Hutool介绍
#x1f333;准备工作
#x1f334;约定前后端交互接口
#x1f6a9;接口定义
#x1f6a9;实现服务器后端代码
#x1f6a9;前端代码
#x1f6a9;整体测试 #x1f332;实现说明
随着安全性的要求越来越⾼…目
实现说明
Hutool介绍
准备工作
约定前后端交互接口
接口定义
实现服务器后端代码
前端代码
整体测试 实现说明
随着安全性的要求越来越⾼,⽬前项⽬中很多都使⽤了验证码,验证码的形式也是多种多样,更复杂的图形验证码和⾏为验证码已经成为了更流⾏的趋势 验证码的实现⽅式很多,可以前端实现,也可以后端实现.⽹上也有⽐较多的插件或者⼯具包可以使⽤, 咱们选择使⽤Hutool提供的⼩⼯具来实现
Hutool介绍
咱们课程中验证码的实现,使⽤Hutool提供的⼩⼯具来实现
Hutool是⼀个Java⼯具包类库对⽂件、流、加密解密、转码、正则、线程、XML等JDK⽅法进⾏封 装组成各种Util⼯具类
Hutool是⼀个⼩⽽全的Java⼯具类库通过静态⽅法封装降低相关API的学习成本提⾼⼯作效 率使Java拥有函数式语⾔般的优雅让Java语⾔也可以甜甜的 Hutool官⽹: https://hutool.cn/
Hutool参考⽂档: https://hutool.cn/docs/#/
Hutool源码: GitHub - dromara/hutool: A set of tools that keep Java sweet. 我们不需要知道这个工具中实现这些功能的代码是如何实现的我们只需要调用它的API即可。
使用方法
第一步导包需要什么就导什么包也可导入该工具中所有的包(此处就导验证码的包)第二步查看验证码接口实现类方法介绍说明第三步查看代码及注释(部分代码实现具体各种验证码查看官网)第四步代码具体实现运行项目发送请求查看line.png文件后端还打印了该验证码此处不在展示
小结Hutool工具有各种各样的验证码以及实现方法当前不在一一展示可自行浏览官网。
准备工作
界⾯如下图所⽰
1. ⻚⾯⽣成验证码
2. 输⼊验证码,点击提交,验证⽤⼾输⼊验证码是否正确,正确则进⾏⻚⾯跳转 创建项⽬,引⼊SpringMVC的依赖包,把前端⻚⾯放在项⽬中 index.html代码如下
success.html代码如下
前端代码验证
约定前后端交互接口
接口定义
接口一生成验证码
请求 GET /captcha/get 响应图片内容 浏览器给服务器发送⼀个 GET /captcha/get 这样的请求,服务器返回⼀个图⽚,浏览器显⽰在⻚⾯上 接口二校验验证码是否正确
请求: /cpatcha/check 响应 true/false 根据⽤⼾输⼊的验证码,校验验证码是否正确true:验证成功.false:验证失败
实现服务器后端代码
首先在pom文件中引入依赖
图片生成代码
测试
由于我们学习了SpringBoot的配置我们可以把图片的高度和宽度放在配置中
代码
验证码校验
注意若使用Hutool工具中的接口来校验验证码的话就需要把上述图片生成代码中的ICaptcha接口提到成员变量上但是这只适用于单线程的时候若是多线程的情况下用多个客户端访问时只有这一个对象那很显然是不合适的所以这个方法是不适合的。
此时就可以借助前面学习的Session了既然有不同的客户端我们就可以通过Session来进行存储每个客户端存储的是自己的Session即在校验的时候我们取的是自己的Session信息
代码
测试
生成验证码
正确校验验证码
错误校验验证码
前端代码
通过ajax请求数据
代码
整体测试
正确校验 错误校验
