在小程序的开发当中,经常会有通过扫描二维码进入小程序领取优惠的功能,这里简单实现一下类似的功能。
第一步:二维码配置
微信扫码所生成的二维码的生成信息需要在微信生成平台的开发设置里的《扫普通链接二维码打开小程序》配置
点击启用就会进入配置页面-配置文档
配置之前注意让运维或者后端人员把下载的校验文件,根据说明文档要求将文件上传至服务器指定目录下,并确保可以正确访问。
验证文件放置规则: 放置于URL中声明的最后一级子目录下,若无子目录,则放置于host所属服务器的顶层目录下。请根据页面提示将验证文件放置在指定的目录下。
配置扫描二维码后打开的小程序功能页面路径,如:pages/index/index
二维码链接开发者可根据开发进度选择在开发版/体验版/线上版本测试
填写符合二维码前缀匹配规则的二维码完整链接用于测试,如包括参数,请完整填写。
一个规则可以填写不多于5个测试链接,可多次修改。若二维码与测试链接匹配,且用户微信号是小程序指定的管理员/开发者/体验者,将打开指定版本的小程序。
测试完成后开发者可将二维码跳转规则发布现网,发布后扫描所有符合匹配规则的二维码,将跳转至指定的小程序页面。
以上所有配置完成之后,开发者就可以得到类似与“https://qw.dsidaa.com/share?activity_id=1&parent_id=2“的https链接。然后根据链接生成二维码就可以跳转到匹配的小程序页面页面了。
第二步:处理二维码数据
跳转到开发者上一步设置的小程序页面后,我们可以在小程序的onLoad当中获取到options.q的数据链接。
onLoad(options) {
if(Boolean(options.q)){
// decodeURIComponent()函数 用于对对 URI 组件进行解码,不然扫描出来的是乱码
let optionsUrl = decodeURIComponent(options.q);
let parent_id = this.getQueryString(optionsUrl,'parent_id');
let activity_id = this.getQueryString(optionsUrl,'activity_id');
};
},
注意:options.q数据必须使用decodeURIComponent()函数进行解码,不然得到就是一对乱码数据。
解码后我们就可拿到一条我们之前配置好的https链接比如:‘https://qw.dsidaa.com/share?activity_id=1&parent_id=2’,接下来我们就可以链接中携带的数据,完成项目下一步的功能。下面是我自己写的一个小方法,喜欢的可以任意取用。
// 取出所需的值 url是解析出来的路径,name是所需值的名称
getQueryString(url,name){
let arr = url.split('?');
let arr2 = arr[1].split("&");
for(let i =0;i<arr2.length;i++){
let arr3 = arr2[i].split("=");
if(arr3[0]==name){
return arr3[1];
};
};
},
以上就是全部的微信扫描二维码进入小程序的全部配置和代码了