前端h5整合阿里雲滑塊驗證
阿新 • • 發佈：2019-01-10
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
<!-- 國內使用 -->
<script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/nch5/index.js?t=2015052012"></script>
<!-- 若您的主要使用者來源於海外，請替換使用下面的js資源 -->
<!-- <script type="text/javascript" charset="utf-8" src="//aeis.alicdn.com/sd/nch5/index.js?t=2015052012"></script> -->
</head>
<body>
<div id="__nc" style="margin-left:auto;margin-right:auto;width:80%;height:100px;padding-top:100px;">
<div id="nc"></div>
</div>
<script>
var nc_token = ["CF_APP_1", (new Date()).getTime(), Math.random()].join(':');
var nc=NoCaptcha.init({
renderTo: '#nc',
appkey: 'CF_APP_1',
scene: 'register',
token: nc_token,
trans: {"key1": "code200"},
elementID: ["usernameID"],
is_Opt: 0,
language: "cn",
timeout: 10000,
retryTimes: 5,
errorTimes: 5,
inline:false,
apimap: {
// 'analyze': '//a.com/nocaptcha/analyze.jsonp',
// 'uab_Url': '//aeu.alicdn.com/js/uac/909.js',
},
bannerHidden:false,
initHidden:false,
callback: function (data) {
window.console && console.log(nc_token)
window.console && console.log(data.csessionid)
window.console && console.log(data.sig)
//請求介面呼叫驗籤
},
error: function (s) {
}
});
NoCaptcha.setEnabled(true);
nc.reset();//請務必確保這裡呼叫一次reset()方法
NoCaptcha.upLang('cn', {
'LOADING':"載入中...",//載入
'SLIDER_LABEL': "請向右滑動驗證",//等待滑動
'CHECK_Y':"驗證通過",//通過
'ERROR_TITLE':"非常抱歉，這出錯了...",//攔截
'CHECK_N':"驗證未通過", //準備喚醒二次驗證
'OVERLAY_INFORM':"經檢測你當前操作環境存在風險，請輸入驗證碼",//二次驗證
'TIPS_TITLE':"驗證碼錯誤，請重新輸入"//驗證碼輸錯時的提示
});
</script>
</body>
</html>