項(xiàng)目介紹

行為驗(yàn)證碼采用嵌入式集成方式，接入方便，安全，高效，拋棄了傳統(tǒng)字符型驗(yàn)證碼展示-填寫(xiě)字符-比對(duì)答案的流程，采用驗(yàn)證碼展示-采集用戶行為-分析用戶行為流程，用戶只需要產(chǎn)生指定的行為軌跡，不需要鍵盤(pán)手動(dòng)輸入，極大優(yōu)化了傳統(tǒng)驗(yàn)證碼用戶體驗(yàn)不佳的問(wèn)題；同時(shí)，快速、準(zhǔn)確的返回人機(jī)判定結(jié)果。目前對(duì)外提供兩種類型的驗(yàn)證碼，其中包含滑動(dòng)拼圖、文字點(diǎn)選。如圖1-1、1-2所示。若希望不影響原UI布局，可采用彈出式交互。

滑動(dòng)拼圖

點(diǎn)選文字

概念術(shù)語(yǔ)描述

術(shù)語(yǔ)	描述
驗(yàn)證碼類型	1）滑動(dòng)拼圖blockPuzzle 2) 文字點(diǎn)選 clickWord
驗(yàn)證	用戶拖動(dòng)/點(diǎn)擊一次驗(yàn)證碼拼圖即視為一次"驗(yàn)證",不論拼圖/點(diǎn)擊是否正確
二次校驗(yàn)	驗(yàn)證數(shù)據(jù)隨表單提交到后臺(tái)后，后臺(tái)需要調(diào)用captchaService.verification做二次校驗(yàn)。目的是核實(shí)驗(yàn)證數(shù)據(jù)的有效性。 ?

交互流程

用戶訪問(wèn)應(yīng)用頁(yè)面，請(qǐng)求顯示行為驗(yàn)證碼;

用戶按照提示要求完成驗(yàn)證碼拼圖/點(diǎn)擊

用戶提交表單，前端將第二步的輸出一同提交到后臺(tái);

驗(yàn)證數(shù)據(jù)隨表單提交到后臺(tái)后，后臺(tái)需要調(diào)用captchaService.verification做二次校驗(yàn)。

第4步返回校驗(yàn)通過(guò)/失敗到產(chǎn)品應(yīng)用后端，再返回到前端。如下圖所示:

目錄結(jié)構(gòu)

├─core
│?├─captcha????java核心源碼
│?└─captcha-spring-boot-starter????springboot快速啟動(dòng)
├─images???????效果圖
├─service
│?├─springboot????后端為springboot項(xiàng)目示例
│?└─springmvc????后端為springmvc非springboot項(xiàng)目示例
└─view???????多語(yǔ)言客戶端示例
?├─android????原生android實(shí)現(xiàn)示例
?├─flutter????flutter實(shí)現(xiàn)示例
?├─html????原生html實(shí)現(xiàn)示例
?├─ios????原生ios實(shí)現(xiàn)示例
?├─uni-app????uni-app實(shí)現(xiàn)示例
?└─vue????vue實(shí)現(xiàn)示例

?

1.1 電腦在線體驗(yàn):https://mirror.anji-plus.com/captcha-web/

1.2 微信小程序和H5在線體驗(yàn)（基于uni-app實(shí)現(xiàn)）

微信小程序 ?

?微信小程序Demo

項(xiàng)目地址

開(kāi)源地址：https://gitee.com/anji-plus/captcha

總結(jié)

以上是生活随笔為你收集整理的推荐一个非常好的行为验证码开源项目！的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。