接入 顶象滑动验证码

注册账号

	由于是学习使用，用的是免费的
	访问顶象官网，注册账号后登录控制台，访问“无感验证”模块，申请开通后系统会分配一个唯一的AppId、AppSecret。

SDK下载

去官网下载sdk，对应的有JAVA、PHP、Python、C#、NODEJS
**业务流程**
当用户滑动验证码通过后，验证码服务会生成一个token，用户的业务请求带上这个验证码token，业务系统再调用后台 SDK 验证token的有效性。

---

| 用户业务请求 | ----> | 业务系统 | ----> | 验证码服务 |
| (请求带上验证码token) | | (获取token，调用验证码接口) | | (校验token有效性)

后端实现

**这里以java为例：**

/**构造入参为appId和appSecret
 * appId和前端验证码的appId保持一致，appId可公开
 * appSecret为秘钥，请勿公开
 * token在前端完成验证后可以获取到，随业务请求发送到后台，token有效期为两分钟
 * ip 可选，提交业务参数的客户端ip
 **/
String appId = "appId";
String appSecret = "appSecret";
CaptchaClient captchaClient = new CaptchaClient(appId,appSecret);
//captchaClient.setCaptchaUrl(captchaUrl); 
//特殊情况需要额外指定服务器,可以在这个指定，默认情况下不需要设置
CaptchaResponse response = captchaClient.verifyToken(token);
//CaptchaResponse response = captchaClient.verifyToken(token, ip);
//针对一些token冒用的情况，业务方可以采集客户端ip随token一起提交到验证码服务，验证码服务除了判断token的合法性还会校验提交业务参数的客户端ip和验证码颁发token的客户端ip是否一致 
System.out.println(response.getCaptchaStatus());
//确保验证状态是SERVER_SUCCESS，SDK中有容错机制，在网络出现异常的情况会返回通过
//System.out.println(response.getIp());
//验证码服务采集到的客户端ip
if (response.getResult()) {
    /**token验证通过，继续其他流程**/
} else {
    /**token验证失败，业务系统可以直接阻断该次请求或者继续弹验证码**/
}

WEB端接入

	也可以引入Android、微信小程序等

引入 JS

<script src="https://cdn.dingxiang-inc.com/ctu-group/captcha-ui/index.js"></script>

直接引入cdn，不要下载，因为会不定期更新
初始化
假设页面上有一个 <div id="c1"></div>，则可以像下面这样初始化验证码：

var myCaptcha = _dx.Captcha(document.getElementById('c1'), {
    appId: 'appId', //appId，在控制台中“应用管理”或“应用配置”模块获取
    success: function (token) {
      // console.log('token:', token)
    }
})

大小和样式可以调整，具体可以参考官网的详细教程，如果要定制化的话就要钱了
官网文档

效果图