Vue引入阿里云滑块验证

1.在index.html中引入相关js文件




...


2.在组件中使用

     

3.初始化

        let that = this;
        let nc = NoCaptcha.init({
          renderTo: '#captcha',
          appkey: this.appkey,//这个参数需要后台返回
          scene: this.scene,//这个也是
          token: this.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) {
            console.log(data);
            that.verify_token = this.token;
            that.sessionid = data.csessionid;
            that.sig = data.sig;
          },
          error: function (s) {
            console.log(s)
          }
        });
        NoCaptcha.setEnabled(true);
        nc.reset();//请务必确保这里调用一次reset()方法
        NoCaptcha.upLang('cn', {
          'LOADING': "加载中...",//加载
          'SLIDER_LABEL': "请向右滑动验证",//等待滑动
          'CHECK_Y': "验证通过",//通过
          'ERROR_TITLE': "非常抱歉,这出错了...",//拦截
          'CHECK_N': "验证未通过", //准备唤醒二次验证
          'OVERLAY_INFORM': "经检测你当前操作环境存在风险,请输入验证码",//二次验证
          'TIPS_TITLE': "验证码错误,请重新输入"//验证码输错时的提示
        });

你可能感兴趣的:(Vue引入阿里云滑块验证)