寫在前面
這里是常用驗(yàn)證碼的第三篇——滑動(dòng)/圖形驗(yàn)證碼监右。
在前兩篇已經(jīng)實(shí)現(xiàn)了隨機(jī)驗(yàn)證碼和算術(shù)驗(yàn)證碼，感興趣的可以去看一下~
除了這兩種常用的驗(yàn)證碼之外错蝴，現(xiàn)在最經(jīng)常用到的還有幾種呜笑，比如滑動(dòng)驗(yàn)證，圖片驗(yàn)證等畴栖，這一類的驗(yàn)證碼一般借助于第三方來(lái)處理即可随静。比如圖形驗(yàn)證碼：
本篇紀(jì)錄兩種常用驗(yàn)證碼的第三方調(diào)用方式：
- 滑動(dòng)驗(yàn)證碼
- 圖形驗(yàn)證碼
滑動(dòng)驗(yàn)證碼
1. 示例
2. 應(yīng)用場(chǎng)景
人機(jī)驗(yàn)證服務(wù)適用于登錄、注冊(cè)吗讶、活動(dòng)燎猛、論壇、短信等高風(fēng)險(xiǎn)業(yè)務(wù)場(chǎng)景照皆。
3. 實(shí)際意義
通過(guò)對(duì)用戶的行為數(shù)據(jù)重绷、設(shè)備特征與網(wǎng)絡(luò)數(shù)據(jù)構(gòu)建多維度數(shù)據(jù)分析，使用業(yè)界先進(jìn)的風(fēng)控引擎結(jié)合“規(guī)則+AI”模型膜毁，對(duì)風(fēng)險(xiǎn)設(shè)備使用昭卓、模擬行為、暴力重放等攻擊進(jìn)行綜合實(shí)時(shí)風(fēng)控判決瘟滨。
4. 使用流程
接入平臺(tái)： 阿里云
搜索引擎搜索打開(kāi)阿里云官網(wǎng)候醒，注冊(cè)并登錄。搜索欄搜索關(guān)鍵詞：
驗(yàn)證碼
然后在結(jié)果中點(diǎn)擊進(jìn)入【人機(jī)驗(yàn)證(驗(yàn)證碼)】
- 點(diǎn)立即開(kāi)通杂瘸，即可獲取自己的專屬token,記錄下即可在代碼配置中會(huì)用得到
- 點(diǎn)擊產(chǎn)品文檔倒淫，各種配置在里面查看配置即可；
- 示例
<div id="checkId" class="nc-container"></div> <!--No-Captcha渲染的位置败玉，其中 class 中必須包含 nc-container-->
// 首先得先引入資源如下
<script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script>
// 配置即可
var nc_token = ["[自己的key值]", (new Date()).getTime(), Math.random()].join(':');
var NC_Opt =
{
renderTo: "#checkId",
appkey: "[自己的key值]",
scene: "nc_login",
token: nc_token,
customWidth: 300,
trans:{"key1":"code0"},
elementID: ["usernameID"],
is_Opt: 0,
language: "cn",
isEnabled: true,
timeout: 3000,
times:5,
callback: function (data) {
// 驗(yàn)證后續(xù)操作
window.console && console.log(nc_token)
window.console && console.log(data.csessionid)
window.console && console.log(data.sig)
}
}
var nc = new noCaptcha(NC_Opt)
// 在此處配置相關(guān)文案信息
nc.upLang('cn', {
_startTEXT: "請(qǐng)按住滑塊敌土，拖動(dòng)到最右邊",
_yesTEXT: "驗(yàn)證通過(guò)",
_error300: "哎呀镜硕，出錯(cuò)了，點(diǎn)擊<a href=\"javascript:__nc.reset()\">刷新</a>再來(lái)一次",
_errorNetwork: "網(wǎng)絡(luò)不給力返干，請(qǐng)<a href=\"javascript:__nc.reset()\">點(diǎn)擊刷新</a>",
})
- 打開(kāi)后如案例所示兴枯，完成~
圖形驗(yàn)證碼
1. 示例
2. 應(yīng)用場(chǎng)景
- 注冊(cè)登錄
- 活動(dòng)秒殺
- 點(diǎn)贊發(fā)帖
- 數(shù)據(jù)保護(hù)
3. 實(shí)際意義
為網(wǎng)頁(yè)、App矩欠、小程序開(kāi)發(fā)者打造立體财剖、全面的人機(jī)驗(yàn)證，最大程度地保護(hù)注冊(cè)登錄晚顷、活動(dòng)秒殺峰伙、點(diǎn)贊發(fā)帖、數(shù)據(jù)保護(hù)等各大場(chǎng)景下的業(yè)務(wù)安全该默。
4. 使用流程
接入平臺(tái)： 騰訊云
搜索引擎搜索打開(kāi)騰訊云官網(wǎng)瞳氓，注冊(cè)并登錄。搜索欄搜索關(guān)鍵詞：
驗(yàn)證碼
然后在結(jié)果中點(diǎn)擊進(jìn)入【驗(yàn)證碼】
- 點(diǎn)立即選購(gòu)（體驗(yàn)即可栓袖，無(wú)需付費(fèi)）或者在線體驗(yàn)
- 點(diǎn)擊產(chǎn)品文檔匣摘，各種配置在里面查看配置即可；
相比之下裹刮，騰訊云的基本使用方法則比阿里云簡(jiǎn)單的多音榜，示例如下： - 示例
<button id="TencentCaptcha" data-appid="2041127177" data-cbfn="callback" type="button">驗(yàn)證</button>
// 首先得先引入資源如下
<script src="https://ssl.captcha.qq.com/TCaptcha.js"></script>
// 基礎(chǔ)使用
window.callback = function (res) {
// 添加自己相應(yīng)配置即可
console.log(res)
if (res.ret === 0) {
alert(res.ticket) // 票據(jù)
}
}
- 完成~
