三维身份验证
三维身份验证是基于公用云的云原生、AI模型、防Bots、多维度风控、威胁情报、溯源定位能力的创新型身份验证服务，可以在身份验证场景、活动场景、爬虫场景等用户身份交互场景处部署。可以通过轻量级的部署来有效解决撞库攻击、爬虫、弱口令、实时代理IP、小号注册、人机识别等多种身份验证威胁，同时是传统字符验证码、行为验证码、身份验证解决方案的升级替换解决方案，任何场景的威胁都可以通过三维的身份进行识别、防御和深度溯源关联
1. 前端接入文档
1.1 SDK接入：
弹出式：
http示例： http://sdk.tj.wuthreat.com/PopUpSdk_v2.js
https示例： https://sdk.tj.wuthreat.com/PopUpSdk_v2.js
嵌入式/触发式：
http示例： http://sdk.tj.wuthreat.com/TriggerEmbedSdk_v2.js
https示例： https://sdk.tj.wuthreat.com/TriggerEmbedSdk_v2.js
1.2.1 调用初始化函数---定制按钮
弹出式：
Window.nextVerify('element', 'appKey',{
//按钮参数配置
'width':'320px'//宽度
'height':'40px'//高度
'text': '立即点击验证'//按钮文案
'type':2//按钮类型
'encryption': false//图片网络协议
, ready :function (instance) {
验证按钮初始化加载完成
}, success:function(passtoken，utoken) {
// 验证成功后触发该函数，进行二次验证
},
})
*注：如调用二次验证后，再次使用时，须手动初始化验证码方法。
触发式：
Window.nextVerifymold('element', 'appKey',{
//按钮参数配置
'width':'320px'//宽度
'height':'40px'//高度
'text': '立即点击验证'//按钮文案
'appear_type':2//验证方式
'type':2//按钮类型
'encryption': false//图片网络协议
, ready :function (instance) {
验证按钮初始化加载完成
}, success:function(passtoken，utoken) {
// 验证成功后触发该函数，进行二次验证
},
})
参数配置：
| 参数名 | 类型 | 必填 | 默认项 | 描述 |
|---|---|---|---|---|
element |
HTMLElement |
是 | 无 | 容器元素或容器元素选择器。 |
appKey |
String |
是 | 无 | 无胁安全平台创建验证码后得到的AppKey |
width |
String |
是 | 310px | 验证按钮宽度，推荐设置宽度260px-350px，后缀为px |
height |
String |
是 | 40px | 验证按钮的高度，推荐设置高度35px-65px，后缀为px |
text |
String |
是 | 立即验证 | 按钮上的文案 |
type |
Number |
是 | 无 | 按钮类型：自有按钮为1，定制按钮为2 |
appear_type |
Number |
否 | 无 | 用于区分验证类型，使用触发式或嵌入式时该参数为必填项，1为嵌入式，2为触发式，具体使用请依照示例代码 |
encryption |
Boolean |
是 | 否 | 验证图片网络协议，ture为https，false为http |
ready |
function |
是 | 无 | 所有工作准备就绪，用户可以使用验证码并成功显示验证按钮时触发该回调 |
success |
function |
是 | 无 | 验证码验证成功后触发回调函数，用户可以执行后续逻辑，如：直接登录或进行二次验证 |
1.2.2 调用初始化函数---自有按钮
弹出式：
Window.nextVerify('element', 'appKey',{
'width':'320px'
'height':'40px'
'type':1
'encryption': false
, ready :function (instance) {
验证按钮初始化加载完成
}, success:function(passtoken，utoken) {
// 验证成功后触发该函数，进行二次验证
},
})
触发式：
Window.nextVerifymold('element', 'appKey',{
'width':'320px'
'height':'40px'
'text': '立即点击验证'
'appear_type':2//验证方式
'type':1
'encryption': false
, ready :function (instance) {
验证按钮初始化加载完成
}, success:function(passtoken，utoken) {
// 验证成功后触发该函数，进行二次验证
}
})
注：参数配置请参照上方文档，只需配置width，height，type，encryption，appear_type(触发式为必填)，其中width，height需与实际自定义按钮的数据一致且为必填项，使用自有按钮时，需给按钮设置相对定位属性(relative)，否则不生效，详情请看下方代码示例
1.2.3 调用初始化函数(验证方式：嵌入式)---与按钮类型无关，直接嵌入在页面中
嵌入式：
Window.nextVerifymold('element', 'appKey',{
'appear_type':1//验证方式
'encryption': false
, ready :function (instance) {
验证按钮初始化加载完成
}, success:function(passtoken，utoken) {
// 验证成功后触发该函数，进行二次验证
}
})
注：嵌入式仅支持普通验证码，不能用于智能验证码！
1.3 相关代码示例
自有按钮-弹出式（#captcha_1），定制按钮-弹出式（#captcha_2）：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>智能验证码示例</title>
<script charset="UTF-8" type="text/javascript" src="https://sdk.tj.wuthreat.com/PopUpSdk_v2.js"></script>
</head>
<body>
<div id="captcha_1"></div>
<div id="captcha_2"></div>
<style>
#captcha_1{
width:320px;
height:40px;
position: relative;
....
}
</style>
</body>
</html>
<script>
Window.nextVerify('#captcha_1', 'appKey',{
'width': '320px',
'height': '40px',
'type': 1,
'encryption': false,
ready: function () {
// 初始化成功后触发该函数
},
success: function (passtoken,utoken) {
// 验证成功后触发该函数，进行二次验证
},
}),
Window.nextVerify('#captcha_2', 'appKey',{
'width': '320px',
'height': '40px',
'text': '立即验证',
'type': 2,
'encryption': false,
ready: function () {
// 初始化成功后触发该函数
},
success: function (passtoken,utoken) {
// 验证成功后触发该函数，进行二次验证
},
}),
</script>
自有按钮-触发式（#user_login_hover（上）），定制按钮-触发式（#user_login_hover（下））：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>智能验证码示例</title>
<script charset="UTF-8" type="text/javascript" src="https://sdk.tj.wuthreat.com/TriggerEmbedSdk_v2.js"></script>
</head>
<body>
<div id="mold_hover"></div>
<div id="user_login_hover">确认提交</div>
<style>
#user_login_hover{
width:320px;
height:40px;
....
}
</style>
</body>
</html>
<script>
Window.nextVerifymold('#user_login_hover', 'appKey',{
'width': '320px',
'height': '40px',
'type': 1,
'appear_type': 2,
'encryption': false,
ready: function () {
// 初始化成功后触发该函数
},
success: function (passtoken,utoken) {
// 验证成功后触发该函数，进行二次验证
},
}),
Window.nextVerifymold('#user_login_hover', 'appKey',{
'width': '320px',
'height': '40px',
'text': '立即验证',
'type': 2,
'appear_type': 2,
'encryption': false,
ready: function () {
// 初始化成功后触发该函数
},
success: function (passtoken,utoken) {
// 验证成功后触发该函数，进行二次验证
},
}),
</script>
嵌入式：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>智能验证码示例</title>
<script charset="UTF-8" type="text/javascript" src="https://sdk.tj.wuthreat.com/TriggerEmbedSdk_v2.js"></script>
</head>
<body>
<div id="mold_inner"></div>
<div id="user_login_inner"></div>
<style>
</style>
</body>
</html>
<script>
Window.nextVerifymold('#user_login_inner', 'appKey',{
'appear_type': 1,
'encryption': false,
ready: function () {
// 初始化成功后触发该函数
},
success: function (passtoken,utoken) {
// 验证成功后触发该函数，进行二次验证
},
}),
</script>
注：目前嵌入式与触发式的标签名只能为mold_inner，user_login_inner，mold_hover，user_login_hover，标签属性只支持id且只能按照示例代码位置去引入，后续版本将做修改，敬请期待！