关于微信小程序 “扫普通链接二维码打开小程序”动态传递多个参数开发过程记录与总结

小程序 专栏收录该内容
2 篇文章 0 订阅

前言:因项目中需要线下 扫描二维码进入到小程序完成 身份绑定,二维码中 要动态传递多个参数,看了官网文档介绍以及官方论坛,整个过程还比较顺利,特把整个过程中遇到的坑点做以总结。

 快速跳转官网文档介绍:扫码打开小程序接入指南

开发前相关配置

首先按照官方文档我们先做好配置工作,配置流程如下:小程序后台配置-开发管理-开发设置-扫普通链接二维码打开小程序,

 

开发过程中配置,举个例子:假如我们二维码的地址是:https://www.xxx.com/xxx?code=xxx,code 是我们要动态传递的参数,那么如何能够动态传递呢?这里我们需要去改变一下我们二维码的地址,二维码地址我们做一下修改:https://www.xxx.com/xxx?name=test&code=xxx。这里很明显我们把code放到放到第二参数去接收,第一个参数 可以随便写,但必须是固定的参数,不能修改。这里我们取添加一个规则:

这里注意  下载效验文件,效验文件要放到 https://www.xxx.com/QUIGNQWuhh.txt下,并确保可以访问,可以访问了才能生成规则,开发版我一直接收不到动态参数,这里我选的体验版,体验版在小程序后台成员管理中要维护相应的 体验成员账号。测试账号可以先传几个 固定的code码进行测试。体验版中一定要注意:没有在测试链接维护的账号生成的二维码是扫不出来的,在这里纠结了很长时间才发现,没有关系我们先维护两个账号完成开发测试。另外记得每次都要在微信开发者工具里进行代码上传到体验版中才能看到效果。(个人感觉这里调试很麻烦,没找到方便途径)

 

 开发调试

 生成好规则,上传完代码,这个时候 用测试链接中的地址生成二维码已经可以跳转到小程序了。这里已经成功了一半。接下来就是拿参数了,因为我们的小程序使用Taro开发的,这里我主要讲在Taro中接收参数,扫码进来后在跳转的页面 通过userRouter接收参数,Taro路由参数接受可以参考我的另一篇博客:Taro中接收路由参数。const router=useRouter() 接收参数如下

{params:{q: https%3A%2F%2Fwww.xxx.com.cn%xxx%name%test%code%123456} }

这里需要解码一下  通过 decodeURIComponent 进行解码后为:https://www.xxx.com/xxx?name=test&code=123456  就是二维码的链接,接下来我们只需要通过字符串解析拿到&后面的参数,这里我封装了一个方法

// 获取url参数 支持中文
export const GetRequest = (params) => {
    let url = params.substring(params.indexOf("?")); //获取url中"?"符后的字串
    let theRequest = new Object();
    if (url.indexOf("?") != -1) {
        let str = url.substr(1);
        let strs = str.split("&");
        for (let i = 0; i < strs.length; i++) {
            theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
        }
    }
    return theRequest;
}

const code= GetRequest(decodeURIComponent(route.params.q))   这里code的值输出一下:123456 完美拿到参数。另外提一下在小程序原生框架中我们应该需要 在 onLoad(options) 方法中去获取,options.q也可以拿到对应的参数,处理方法是一致的。

备注提醒

最后也是很重要一点,我提交代码到体验版,发现只有 测试链接中的配置地址才能跳转到小程序,只要改变code的值,就跳转不进去了。在这一块我卡了很久,最后才发现,只有在线上正式版才会生效。也就是说,这块不用管,调试完成后,代码审核发布,审核发布后记得:把规则修改为线上版,然后发布规则就可以了。这个时候我们发现code可以随意传值,都能跳转小程序了。切记,只有代码和规则发布后才能生效。

我也是抱着忐忑的心情发布了代码和规则,最后忐忑的扫了各个码才发现规则是生效的,所以总结下:体验版-只有测试链接中的地址会生效,线上版-规则才会全部生效。

  • 7
    点赞
  • 0
    评论
  • 5
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 黑客帝国 设计师:白松林 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值