1、前提条件
使用小程序插件接入验证码前,需要先在 验证码控制台 中注册小程序插件 AppID 和 AppSecret,注册完成后,您可以在验证码控制台的验证详情的基础配置中,查看 AppID 以及 AppSecret。
2、在小程序后台添加“天御验证”插件
- 登录 微信公众平台,且需使用接入小程序的相关账号。
- 选择【设置】>【第三方设置】>【添加插件】,在搜索框内输入关键字“天御验证码”查找插件,并单击【添加】
3、uni-app项目内添加和使用插件
- 打开项目 > manifest.json > 源码视图
"mp-weixin" : {
"appid" : "xxxx",
"setting" : {
"urlCheck" : false
},
"usingComponents" : true,
// 添加以下代码
"plugins": {
"t-captcha": {
"version": "1.0.0",
"provider": "wxb302e0fc8ab232b4"
}
}
},
- 打开pages.json,找到需要引入插件的页面
{
"path" : "xxx",
"style" : {
"navigationBarTitleText": "xxx",
"enablePullDownRefresh": false,
// 加入以下代码
"usingComponents": {
"t-captcha": "plugin://t-captcha/t-captcha"
}
}
}
- 在页面加入以下代码
<t-captcha id="captcha" app-id="填写第一步申请的AppID" @verify="handlerVerify" />
// selectComponent需要通过以下方式调用
const arr = getCurrentPages();
arr[arr.length - 1].selectComponent('#captcha').show();