@yidun/alipay-ne-captcha

支付宝小程序

引入

在根目录执行下述命令，https://opendocs.alipay.com/mini/ide/npm-manage

  npm install @yidun/alipay-ne-captcha

在页面或组件的 json 文件中声明引组件

{ "usingComponents": { "ne-captcha": "path-to-component/ne-captcha/index" } } 注意：在支付宝小程序开发者工具中，请务必在详情-项目配置下，勾选启用component2编译。

使用

<view>
  <ne-captcha
    ref="saveCaptchaRef"
    captchaId="CAPTCHA_ID"
    width="320rpx"
    onError="handlerError"></ne-captcha>
  <view>
    <button onTap="handleOpenCaptcha">点击验证</button>
  </view>
</view>

Page({
  saveCaptchaRef (ref) {
    this.captchaRef = ref
  },
  handlerError (error) {},
  handleOpenCaptcha () {
    this.captchaRef.popup()
  }
})

配置项

可配项	类型	默认值	描述
captchaId	String	无	验证码ID
lang	String	'zh-CN'	语言
width	String	'auto'	验证码弹框宽度，接受单位'rpx'/'px'/'rem'/'%'
customStyles	Object	null	自定义验证码样式，详情查看下面
注意： 小程序的超时设置可在 app.json 全局配置

customStyles

• imagePanel
  • borderRadius（String）: imagePanel的圆角大小
• controlBar
  • borderRadius（String）: controlBar的圆角大小
  • height（String）: controlBar的高度
  • gap: imagePanel和controlBar的间隔
• popTitle
  • height（String）: 弹框头部高度
  • popPadding（String）: 弹框体内边距

事件

事件名	参数	描述
onError	无	验证码配置失败
onInit	无	验证码配置成功（初始化）
onReady	无	验证码准备就绪
onVerify	err, validate 验证码验证完成
onClose	无	验证码弹框准备关闭

组件方法

• popup: 展示验证码（支持非智能无感知验证码调用此方法）
• verify: 展示验证码（仅支持智能无感知验证码调用此方法）
• reset: 重置验证码，获取新的验证信息

域名

• 服务器域名：c.dun.163yun.com、c.dun.163.com
• 图片域名：necaptcha.nosdn.127.net、nos.netease.com