object {
outside:true,
bgColor:’#0000004d’
} outside:false,
bgColor:任意合法的 css 颜色单位都可以
弹窗相关配置项,目前包括弹窗背景色、点击验证码区域外是否关闭验证 hideSuccess boolean false 是否隐藏 bind 模式下的成功弹窗

useNativeButton

可选参数:
1.true: 经典带按钮模式
2.false: 无按钮模式,对于此类型,需要用户主动调用 showCaptcha 方法唤起验证界面

代码示例:

<captcha4 useNativeButton="{{false}}" id="captcha" />;

// 打开验证码弹窗
const captcha = this.selectComponent("#captcha");

captcha.showCaptcha();

riskType

前端指定验证形式 (需在后台配置为风控融合模式)

可选参数:

  • match(消消乐验证)
  • winlinze(五子棋验证)
  • slide(滑动拼图验证)
  • icon(图标点选验证)
  • ai(一点即过)
  • word(文字点选验证)
  • phrase(字序点选验证)
  • nine(九宫格验证)
  • 代码示例:

    // 模板上插入配置,此处省略其它必传参数
    <captcha4 riskType="slide" />

    MiniProgram 事件

    Ready

    监听验证按钮的 DOM 生成完毕事件。

    代码示例:

    // qxml
    <captcha4 bindReady="captchaReady"/>
    //js
    captchaReady:function(){
    console.log('captcha-Ready!')
    }

    Error

    监听验证出错事件,刷新过多、静态资源加载失败、网络不给力等验证码能捕获到的错误(参考 ErrorCode ),都会触发 Error 回调。

    Error 返回一个 e,其中 e.detail 包含 2 个属性:code(错误码)、tips(错误提示)。我们在 Error 中要对 challenge 过期的情况做一个特殊的重置处理,代码如下

    代码示例:

    // qxml
    <captcha4 bindError="captchaError"/>
    //js
    captchaError: function (e) {
    console.log('captcha-Error!', e.detail)
    // 这里对challenge9分钟过期的机制返回做一个监控,如果服务端返回code:21,tips:not proof,则重新调用api1重置
    if (e.detail.code === 21) {
    // 调用重置方法
    }
    }

    Success

    监听验证成功事件,返回一个 result 对象,result 中的 detail 包含 4 个属性:lot_number、pass_token、captcha_output、gen_time,这些参数为当前验证成功的凭据,
    二次验证时需要传入。

    代码示例:

    // qxml
    <captcha4 bindSuccess="captchaSuccess"/>
    //js
    captchaSuccess:function(result){
    console.log('captcha-Success!')
    // 这里先将result中的参数保存,待进行二次验证时传入
    this.setData({
    result: result.detail
    })
    }

    Close

    用户关闭弹出来的验证时,会触发该回调。

    代码示例:

    // qxml
    <captcha4 bindClose="captchaClose"/>
    //js
    captchaClose:function(){
    console.log('captcha-Close!')
    }

    MiniProgram 方法

    showCaptcha

    显示验证窗(使用内置按钮模式,该接口不允许调用)

    const captcha = this.selectComponent("#captcha");

    captcha.showCaptcha();

    reset

    重置验证码

    const captcha = this.selectComponent("#captcha");

    captcha.reset();

    hiddenCaptcha

    关闭验证窗

    const captcha = this.selectComponent("#captcha");

    captcha.hiddenCaptcha();