前文在这里:【Part 1】当初去博物馆都预约不上了,黑产多少有点疯狂了
后面这篇文章讲到目前博物馆的门票根本被黄牛薅没了,咱们普通人只能通过黄牛去买票,并且讲到了预约小程序如何通过插件式接入无感验证。
这篇文章咱们持续讲新的无感验证接入形式 – 跳转式接入。话不多说,直入主题。
小程序接入无感验证 – 跳转式接入
1)关联小程序
用管理员身份登录本人的微信公众平台,请应用须要公众号的相干账号(微信公众平台采纳不同账号辨别,公众号的后盾和小程序的后盾别离为不同账号),顺次点击:小程序 - 小程序管理 - 增加 - 关联小程序,而后输出小程序 AppID“wx82db4a59175bdfdf”并搜寻,如下图所示:
2)获取密钥
未注册用户可在官网进行账号注册,创立利用获取利用密钥 AppID 和 AppSecret。已注册用户,可间接在控制台 -> 无感验证 -> 利用治理页面获取对应的 AppID 和 AppSecret。
3)小程序集成
1. 通过 navigator 组件跳转至验证码。
<navigator target="miniProgram"
app-id="wx82db4a59175bdfdf" // 惟一值,小程序插件 id,不可更改
path="/pages/captcha/captcha"
extra-data="{{options}}">
<button> 登陆 </button>
</navigator>
Page({
data: {
options: {
appId: '这里填写在官网申请到的 appId', // 控制台利用治理页面进行获取
customStyle: {
panelBg: '',
captchaBgColor: ''
}
}
}
})
参数阐明:
参数 | 值 | 阐明 |
---|---|---|
appId | String | 这里填写在官网申请到的 appId,留神必须填写正确,否则会报:性能无奈应用 |
customStyle | Object | 自定义款式对象,panelBg 为整个页面的 background 属性,captchaBgColor 为验证码的 background-color 属性 |
2. 在验证码中验证,图片如下所示:
3. 验证胜利后,验证后果会在调用方 app.js 中顶 onShow 生命周期办法中取到。
if (options.scene === 1038 && options.referrerInfo.appId === 'wx82db4a59175bdfdf') {
const result = options.referrerInfo.extraData;
if (result) {console.log('返回后果:', result)
} else {// 用户点击右上角敞开了验证码}
}
验证后果阐明:
参数 | 值 | 阐明 |
---|---|---|
success | Boolean | 验证胜利 |
token | String | 验证胜利才有:token |
msg | String | 验证失败或参数不非法才有:错误信息 |
结语
跳转式会比插件式接入更简略一点,所以更加举荐跳转式。前面有机会再来写支付宝小程序的验证码接入~~