- 目前最大的坑就是网址问题
注意：打死不看的，都要打死！！！！
//pf-api.xoyo.com/passport/pre_auth 这个是用于通行证：适用于通用登录，注册
(测试: //my-api-dev.xoyo.com/passport/common_api/pre_auth)
//ws.xoyo.com/core/captcha/pre_auth 这个是用于专题：适用于专题需要验证的业务，
//test-ws.xoyo.com/core/captcha/pre_auth 这个是用于专题测试
使用方法
加载JS：
<script src="//zhcdn01.xoyo.com/xassets/lib/jquery/1.7.2/jquery.js"></script>
<script src="//zhcdn01.xoyo.com/xassets/com/pf/jizhicode/jiyan.js"></script>
部署html：
初始化极验
$('.xsj_jiyan_dom_two').jiyanPublic({
domName:'.xsj_jiyan_dom_two',
onDomReady:function () { //DOM加载完毕回调 用于修改DOM结构
$('.J_waitJiyan').css('border','red solid 1px')
},
jiyanCallback: function(yzType,captchaObj){ //验证回调
/*
* @param yzType 根据pre_auth后端接口返回的值做出判断
* yzType === jiyan 为极致验证码模式
* yzType === putong 为极致验证码模式
*
*
* @param captchaObj 如果yzType === jiyan
* captchaObj 返回的就是检验的参数值
* 这些参数值需要回传给后端接口
* demo: captchaObj.getValidate() == { geetest_challenge: "836446bc0ab81b45c00698a5df5dbdde", geetest_validate: "e37b3d4b38e06b1131737526c9952ac3", geetest_seccode: "e37b3d4b38e06b1131737526c9952ac3|jordan"}
*
* 最后把这三个返回值传回给后端
*
* data: {
* geetest_challenge: captchaObj.getValidate.geetest_challenge,
* geetest_validate: captchaObj.getValidate.geetest_validate,
* geetest_seccode: captchaObj.getValidate.geetest_seccode,
* geetest_ctype: 'web'
* },
*
*
*
*
*
* 如果yzType === putong
* 直接传DOM里面的input值
* $('.J_inputPutongCodeVal').val()
*
*/
}
})
成功或者失败后做reset处理
DEMO:
$.ajax({
url:xxxx,
dataType:"jsonp",
data:{
geetest_challenge: $result.geetest_challenge,
geetest_validate: $result.geetest_validate,
geetest_seccode: $result.geetest_seccode
},
success:function($data){
captchaObj.reset(); //这个一定要加，就像图片验证码，不管成功失败，只能用一次
}
});
DEMO网址
面向对象案例
http://zhcdn01.xoyo.com/xassets/com/pf/jizhicode/demo01.html
面向过程案例
http://zhcdn01.xoyo.com/xassets/com/pf/jizhicode/demo02.html
参数说明
domName: '', //*必填*/class或者id名，最后把极验框插入这里
isJizhiArea: false, //是否 开启极致验证指定弹出区域 此时会把后续验证弹出到以下指定ID的区域内居中显示
areaJizhiId: null, //极致验证指定弹出区域 id
nextWidthJizhi: '260px', //极致验证指定弹出区域 宽度
ajaxUrl: 'http://ws.xoyo.com/', //接口网址
// ajaxUrl:'http://test-ws.xoyo.com/', //用于测试接口
onDomReady:function () { //DOM拼装完毕时 回调(用于修改DOM结构和文字)
},
/**
* yzType : 'putong','jiyan' 分普通，极致验证两种
* 如果是极验： captchaObj 就是极验的回调值
*/
jiyanCallback: function (yzType,captchaObj) { //回调
}
gitlab网址：
https://gitlab.xsjcs.cn/xfe/xassets/tree/master/com/pf/jizhicode
效果演示