前言
图形验证码的主要目是为了解决验证安全问题。常见的使用场景有,登录与注册、短信验证码下发、投票、论坛评论、搜索等场景。
通过在原有业务逻辑上,增加图形验证码验证环节,有效地扼制了非法攻击。例如,我们公司曾发生过,黑产恶意刷短信接口,导致短信费用剧增,耗尽短信账号的资金,影响了正常用户的使用。因此,为了保障业务的正常进行,我们需要对一些存在安全问题的业务,增加验证环节。
背景
最近,由于极验提供的图形验证码(行为验证)服务不稳定,经常出现无法验证的情况,影响了正常业务的进行。为了保证业务的正常运行,需要对服务进行容灾处理,所以调研了市场上验证码服务,作为备选方案。
主要调研服务厂商有:
极验接入
业务流程时序图
简化一下,实际只有两步:
- 获取验证流水;
- 获取二次验证结果。
更为详细的解释,可以参考极验官方文档。
服务端接入
服务端我们使用 NodeJS 语言进行开发,主要针对获取验证流水(API 1)和二次验证(API 2)这两个接口进行编码。
服务端代码示例:https://github.com/youthcity/graph-captcha/blob/master/src/geetest/geetest_client.ts
Step 1 安装极验 Node SDK
# 安装官方的依赖包
npm install gt3-sdk
Step 2 从极验后台获取配置并初始化实例
geetest_id
和 geetest_key
可以从管理后台获取。
this.client = new Geetest({
geetest_id: config.geetest_id,
geetest_key: config.geetest_key,
});
Step 3 封装 register
和 validate
方法
为了方便使用,我们对极验实例的原函数进行Promise化。
public async register(params?:RegisterParams) : Promise<RegisterData> {
return new Promise<RegisterData>((reslove, reject) => {
this.client.register(params, (err:any, data:RegisterData) => {
if (err) {
return reject(err);
}
return reslove(data);
});
});
}
public async validate(fallback:boolean, params:ValidateParams) : Promise<boolean> {
return new Promise<boolean>((reslove, reject) => {
return this.client.validate(fallback, {
geetest_challenge: params.geetest_challenge,
geetest_validate: params.geetest_validate,
geetest_seccode: params.geetest_seccode,
}, (err:any, success:boolean) => {
if (err) {
return reslove(false);
}
return reslove(success);
});
});
}
Step 4 API 1 获取流水并设置状态码
通过调用 register
方法,即可获取流水参数,需要注意返回结果中 success
值。因为,第二个验证方法,需要根据这个状态值,设置 is_fallback
(极验官方文档中,此变量命名为 fallback
)的值。
const result = await Client.register();
if (result.success === 0) {
ctx.session.is_fallback = true;
}
// result
{
challenge: "fbd7939d674997cdb4692d34de8633c465"
gt: "'eb8880df3cd839d11feee555545699c8'"
new_captcha: true
success: 0
}
当 success = 1
时,is_fallback
值设为 false
。success = 1
表示极验服务正常,未进行降级。
若 success = 0
时,is_fallback = true
。
is_fallback
状态值需要保存起来,以便用户进行二次验证使用。此处,我使用session存储用户的状态值。
Step 5 API 2 二次验证
当用户完整验证后,极验会返回前端验证参数。前端需要将验证参数回传给后端,进行二次验证。
const { geetest_challenge, geetest_validate, geetest_seccode } = ctx.query;
const is_fallback = ctx.session.is_fallback ? true : false;
const is_pass = await Client.validate(is_fallback, {
geetest_challenge,
geetest_validate,
geetest_seccode,
});
ctx.body = { is_pass };
客户端接入
以 Web 端为例,可参考项目地址如下:
https://github.com/youthcity/graph-captcha/blob/master/src/static/geetest.html
1)加载客户端 JS 库
<script src="http://static.geetest.com/static/tools/gt.js"></script>
2)调用API 1从后端获取验证流水
3)初始化极验并绑定到DOM中
4)注册验证成功后的回调
总结
整体上,极验是调研的四家中,图形验证码服务最好的一家。主要从开发文档、接入难度、管理工具、客服响应速度这几个维度进行考虑。极验的接入难度较为简单,唯一缺点是Web端 JS SDK不支持懒加载,不能动态进行包的加载。
此外,服务端开发者需要妥善的处理好,获取极验流水时 success
值的记录。因为服务端二次验证时,需要根据此值设置 is_fallback
值。若设置不符,将会导致二次验证失败。且极验的验证参数具有一次性,验证一次后,验证参数将失效。例如,相同验证参数,第一次验证通过,再次验证将会失败。