后端应用安全图像处理【免费下载链接】captcha行为验证码(滑动拼图、点选文字)前后端(java)交互包含h5/Android/IOS/flutter/uni-app的源码和实现项目地址https://gitcode.com/gh_mirrors/captc/captcha点击查看免费下载行为验证码滑动拼图、点选文字作为人机校验的前置防线前端渲染只是第一步真正的安全闭环依赖后端二次校验。本文以本仓库service/springboot示例工程为主线完整讲解基于com.anji-plus:spring-boot-starter-captcha的后端接入流程如何引入依赖、接入内存/Redis 缓存、暴露/captcha/get、/captcha/check、/captcha/verify三个核心接口并在登录等业务接口中完成二次校验同时结合 starter 源码 与 核心实现 深入解析配置参数、AES 加密、异常代号与 Linux 部署字体乱码问题。读完本文你将能够把该验证码组件完整嵌入任意 Spring Boot 业务系统并自行扩展缓存与频控能力。1 接入总览前后端两条链路行为验证码的完整闭环分为两条链路缺一不可前端链路引入前端组件Vue 等调用初始化函数渲染滑动拼图或文字点选验证码用户在页面上完成交互后组件在success回调中返回二次验证参数captchaVerificationAES 加密。后端链路用户提交业务表单如登录时携带该验证码参数产品应用在对应接口中把参数传给集成 jar 包的相关接口做二次校验确保本次验证真实有效从而阻挡脚本刷接口。其中后端链路是本篇的核心对应的示例工程位于 service/springbootSpring Boot 版本为 2.3.5.RELEASE见 pom.xml入口类为 StartApplication.java。2 后端接入2.1 引入 Maven 依赖在业务工程的pom.xml中引入验证码 starter该依赖已发布到 Maven 中央仓库源码也已在仓库中分享即 core/captcha-spring-boot-starterdependency groupIdcom.anji-plus/groupId artifactIdspring-boot-starter-captcha/artifactId version1.3.0/version /dependency版本说明示例工程 service/springboot/pom.xml 中实际使用的是1.3.1二者均可按需选择依赖本仓库核心模块时以实际发布版本为准。starter 通过自动装配AjCaptchaAutoConfiguration.java 等把验证码服务、存储与控制器注册进 Spring 容器因此接入方无需编写大量样板代码。除 starter 外示例工程还依赖spring-boot-starter-web提供控制器、spring-boot-starter-data-redisRedis 缓存、fastjson等见 pom.xml。2.2 缓存实现验证码生成后需要把校验信息暂存起来等待用户完成交互后取出核对。组件定义了统一的缓存 SPI 接口CaptchaCacheServicepublic interface CaptchaCacheService { void set(String key, String value, long expiresInSeconds); boolean exists(String key); void delete(String key); String get(String key); /** * 缓存类型-local/redis/memcache/.. * 通过java SPI机制接入方可自定义实现类 * return */ String type(); }要点说明单节点部署、未使用 Redis 时默认使用内存缓存local对应配置aj.captcha.cache-typelocal。分布式环境必须自行实现该接口例如使用 Redis可参考 service/springboot 示例中的 CaptchaCacheServiceRedisImpl。其注释明确指出内存缓存只适合单节点部署否则验证码生产与验证在节点之间信息不同步会导致校验失败。接入方可通过Java SPI 机制自定义实现类在resources目录下新建META-INF.services目录并登记实现类即可替换默认缓存实现。示例中的 Redis 实现通过StringRedisTemplate完成set带过期时间、exists、delete、get基本操作并额外实现了increment借助 Lua 脚本保证原子自增用于频控计数与setExpire刷新过期时间type()返回redis。完整的注册方式见 CaptchaConfig.java它注入StringRedisTemplate通过CaptchaServiceFactory.getCache(config.getCacheType().name())按配置的缓存类型取实现若为 Redis 实现则注入StringRedisTemplate并注册为名为AjCaptchaCacheService的PrimaryBean。缓存类型在 AjCaptchaProperties.java 中定义为枚举StorageTypelocal内存、redis、other其他可通过 SPI 扩展。2.3 二次校验接口以登录为例用户在前端完成验证码交互后提交表单到产品应用后台表单携带验证码相关参数产品应用在登录接口中把该参数传给集成 jar 包中的校验接口做二次校验。接口地址POST /captcha/verify该接口在 starter 的 CaptchaController.java 中已定义默认被注释可自行开放其核心逻辑是调用captchaService.verification(data)。示例工程则展示了更常见的做法——在业务接口内调用验证码服务RestController RequestMapping(/auth) public class LoginController { Autowired private CaptchaService captchaService; PostMapping(/login) public ResponseModel get(RequestParam(captchaVerification) String captchaVerification) { CaptchaVO captchaVO new CaptchaVO(); captchaVO.setCaptchaVerification(captchaVerification); ResponseModel response captchaService.verification(captchaVO); if(response.isSuccess() false){ //验证码校验失败返回信息告诉前端 //repCode 0000 无异常代表成功 //repCode 9999 服务器内部异常 //repCode 0011 参数不能为空 //repCode 6110 验证码已失效请重新获取 //repCode 6111 验证失败 //repCode 6112 获取验证码失败,请联系管理员 } return response; } }完整源码见 LoginController.java。2.4 请求方式HTTP POST。接口仅支持 POST 请求且仅接受application/json编码的参数starter 控制器通过RequestBody接收 JSON 实体CaptchaVO。2.5 请求参数参数类型必填备注captchaVerificationStringY验证数据AES 加密数据在前端success函数回调参数中获取2.6 响应参数参数类型必填备注repCodeStringY异常代号successBooleanY成功或者失败errorBooleanY接口报错repMsgStringY错误信息2.7 异常代号repCode说明0000无异常代表成功9999服务器内部异常0011参数不能为空6110验证码已失效请重新获取6111验证失败6112获取验证码失败,请联系管理员3 前端接入3.1 兼容性兼容 IE8、Chrome、Firefox其他浏览器未测试。前端组件可在 view/vue、view/html 等目录找到对应实现。3.2 初始化组件引入前端 Vue 组件并安装依赖npm install axios crypto-js -S基础用例节选自 view/vue 的 verifition 组件template Verify successsuccess //验证成功的回调函数 :modefixed //调用的模式 :captchaTypeblockPuzzle //调用的类型 点选或者滑动 :imgSize{ width: 330px, height: 155px }//图片的大小对象 /Verify /template script //引入组件 import Verify from ./../../components/verifition/Verify; export default { name: app, components: { Verify }, methods:{ success(params){ // params 返回的二次验证参数 } } } /script3.3 事件参数说明success验证码匹配成功后的回调函数error验证码匹配失败后的回调函数ready验证码初始化成功的回调函数3.4 验证码参数参数说明captchaType1滑动拼图blockPuzzle2文字点选clickWordmode验证码的显示方式弹出式pop、固定fixed默认是mode: popvSpace验证码图片和移动条容器的间隔默认单位是 px。如间隔为 5px设置vSpace: 5explain滑动条内的提示不设置默认是向右滑动完成验证imgSize包含width、height两个参数分别代表图片的宽度和高度支持百分比方式设置如{width: 100%, height: 200px}blockSize包含width、height两个参数分别代表拼图块的宽度和高度如{width: 40px, height: 40px}barSize包含width、height两个参数分别代表滑动条的宽度和高度支持百分比方式设置如{width: 100%, height: 40px}3.5 获取验证码接口详情接口地址POST /captcha/get该接口由 starter 的 CaptchaController.java 提供内部通过getRemoteId(request)基于 IP优先取X-Forwarded-For首段与 User-Agent 拼装浏览器指纹再调用captchaService.get(data)生成验证码。请求参数{ captchaType: blockPuzzle //验证码类型 clickWord }响应参数{ repCode: 0000, repData: { originalImageBase64: 底图base64, point: { //默认不返回的校验的就是该坐标信息允许误差范围 x: 205, y: 5 }, jigsawImageBase64: 滑块图base64, token: 71dd26999e314f9abb0c635336976635, //一次校验唯一标识 result: false, opAdmin: false }, success: true, error: false }其中token是本次校验的唯一标识后续check与verify均需携带point为正确答案坐标默认不返回给前端。3.6 核对验证码接口详情请求接口POST /captcha/check请求参数{ captchaType: blockPuzzle, pointJson: QxIVdlJoWUi04iM65hTow, //aes加密坐标信息 token: 71dd26999e314f9abb0c635336976635 //get请求返回的token }响应参数{ repCode: 0000, repData: { captchaType: blockPuzzle, token: 71dd26999e314f9abb0c635336976635, result: true, opAdmin: false }, success: true, error: false }该接口由 CaptchaController.java 提供pointJson为前端 AES 加密后的坐标信息服务端校验其与正确答案的偏差是否在允许误差范围内。4 配置参数详解源码级所有配置项前缀为aj.captcha定义于 AjCaptchaProperties.java以ConfigurationProperties方式绑定。以下为常用配置及默认值配置项默认值说明aj.captcha.typeDEFAULT验证码类型可选blockPuzzle/clickWordaj.captcha.jigsaw空滑动拼图底图路径aj.captcha.pic-click空点选文字底图路径aj.captcha.water-mark我的水印右下角水印文字aj.captcha.water-fontWenQuanZhengHei.ttf右下角水印字体aj.captcha.font-typeWenQuanZhengHei.ttf点选文字验证码的文字字体aj.captcha.slip-offset5校验滑动拼图允许误差偏移量默认 5 像素aj.captcha.aes-statustrueAES 加密坐标开关true/falseaj.captcha.interference-options0滑块干扰项0/1/2aj.captcha.cache-number1000local 缓存的阈值aj.captcha.timing-clear180定时清理过期 local 缓存单位秒aj.captcha.cache-typelocal缓存类型local/redis/otheraj.captcha.history-data-clear-enablefalse历史数据清除开关aj.captcha.req-frequency-limit-enablefalse一分钟内接口请求次数限制开关aj.captcha.req-get-lock-limit5一分钟内 check 接口失败次数aj.captcha.req-get-lock-seconds300锁定秒数aj.captcha.req-get-minute-limit100get 接口一分钟内限制访问数aj.captcha.req-check-minute-limit100check 接口一分钟内限制访问数aj.captcha.req-verify-minute-limit100verify 接口一分钟内限制访问数aj.captcha.font-styleFont.BOLD点选字体样式aj.captcha.font-size25点选字体大小相关默认值可在 AjCaptchaProperties.java 中逐一核对。4.1 频控能力验证组件内置了针对同一客户端组件的请求频率限制。从 FrequencyLimitTest.java 的注释可以看到设计的限制策略get1 分钟内失败 5 次锁定 5 分钟1 分钟内不能超过 120 次check1 分钟内不超过 600 次verify1 分钟内不超过 600 次。测试用例通过SpringBootTest启动 StartApplication循环调用captchaService.get/check/verification并打印repCode、repMsg可用于验证频控在真实调用链路上的生效情况。实际阈值以 AjCaptchaProperties.java 中的配置为准可按需调整。5 Linux 部署注意事项点选文字字体乱码5.1 字体乱码问题点选文字中所用字体默认为思源黑体Source Han SansWindows/Linux 服务器均能正常显示中文。若需要指定特殊字体而 Linux 不支持可能出现乱码表现类似下图点选文字字体乱码效果5.2 乱码解决方案从 1.2.6 版本开始核心包内置了开源中文字体思源黑体无需安装配置即可正常显示。支持两种自定义字体方式方式一自定义特定字体将字体放到工程resources下的fonts文件夹支持ttf/ttc/otf格式通过配置项water-font与font-type激活# 水印字体 aj.captcha.water-fontSourceHanSansCN-Normal.otf # 点选文字验证码的文字字体(思源黑体) aj.captcha.font-typeSourceHanSansCN-Normal.otf方式二直接配置 OS 层现有的字体名称例如宋体。因宋体等商业使用需要授权请开发人员在取得授权后使用。Linux 安装字体步骤如下# 水印字体 aj.captcha.water-font宋体 # 点选文字验证码的文字字体 aj.captcha.font-type宋体1、安装字体库从 CentOS 4.x 开始使用 fontconfig 安装字体库sudo yum -y install fontconfig安装后可在/usr/share目录看到fonts和fontconfig目录之前是没有的接下来即可为字体库添加中文字体。2、在 /usr/share/fonts 下新建目录 chineseCentOS 中字体库存放位置即fonts目录需先找到中文字体文件放入该目录——中文字体文件在 Windows 系统中即可找到打开 C 盘下的Windows/Fonts目录复制所需字体。3、修改 chinese 目录权限并安装 ttmkfdirsudo chmod -R 755 /usr/share/fonts/chinese说明以上chmod命令为原文档部署指引的一部分仅用于说明 Linux 服务器端字体目录的权限设置步骤。随后安装 ttmkfdir用于搜索目录中所有字体信息并汇总生成fonts.scale文件sudo yum -y install ttmkfdir然后执行 ttmkfdir 命令ttmkfdir -e /usr/share/X11/fonts/encodings/encodings.dir4、修改字体配置文件通过编辑器打开配置文件vim /etc/fonts/fonts.conf在 Font list字体列表中加入中文字体位置/usr/share/fonts/chinese5、刷新字体缓存输入:wq保存退出后刷新内存中的字体缓存无需 reboot 重启fc-cache6、验证字体列表fc-list通过fc-list可确认新字体已生效。6 Q A 小结为什么要二次校验前端验证码通过后生成的captchaVerification是 AES 加密的验证数据后端在业务接口如登录中通过captchaService.verification(captchaVO)再次校验防止绕过前端直接构造请求攻击接口。分布式部署如何选缓存必须自行实现CaptchaCacheService并接入 Redis参考 CaptchaCacheServiceRedisImpl.java默认内存缓存仅适合单节点。验证码坐标如何加密由aj.captcha.aes-status默认true控制前端使用 crypto-js 加密坐标生成pointJson后端校验时解密并与正确答案比对允许误差由slip-offset默认 5 像素控制。字体乱码怎么办优先使用内置思源黑体需要自定义字体时按上述方式一工程内置 ttf/ttc/otf或方式二配置 OS 层字体并在 Linux 上安装字体库处理。通过以上步骤即可在 Spring Boot 业务系统中完成行为验证码的前后端闭环接入前端渲染/captcha/get→ 交互核对/captcha/check→ 业务二次校验/captcha/verify并针对分布式缓存、频控与 Linux 字体环境完成生产级加固。赞分享后端应用安全图像处理【免费下载链接】captcha行为验证码(滑动拼图、点选文字)前后端(java)交互包含h5/Android/IOS/flutter/uni-app的源码和实现项目地址https://gitcode.com/gh_mirrors/captc/captcha点击查看免费下载相关推荐剑指 Offer 题目分类全解75 道题一张表的刷题地图剑指 Offer 题目分类全解75 道题一张表的刷题地图 75 道题刷完却不知道自己到底练了什么LeetCode Book 把剑指 Offer 题目分类放后端应用安全图像处理5步跑通黑苹果EFIOpCore-Simplify从硬件报告到可引导U盘的完整流程5步跑通黑苹果EFIOpCore Simplify从硬件报告到可引导U盘的完整流程 配置黑苹果最磨人的是EFI手写config.plist、手动挑kext、后端应用安全图像处理WxJava 视频号开发 Spring Boot Starter 接入指南wx-java-channel-spring-boot-starter 从配置到实战WxJava 视频号开发 Spring Boot Starter 接入指南wx java channel spring boot starter 从配置到实战后端即时通讯上一篇模型精度提升的核心秘籍Awesome Data Analysis精选7大特征工程与选择工具下一篇HVM-lang并发模型Actor模型与消息传递的终极实现指南创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考