小白必看 | 一文学会处理带参数的微信小程序二维码

在微信小程序的开发过程中，我们经常会碰到这样的需求：在小程序的二维码中带有不同的参数信息，比如各种ID，实现如一店一码、一物一码这样的功能。

后台开发同学生成好带有参数信息的小程序二维码，通常会包括目标页面，启动参数等信息。目标页面会被微信自动识别，并跳转到指定页面，不需要开发者手动处理。而启动参数则是我们需要关注的。

由于小程序二维码只能进入正式版小程序（其实是可以让后端修改参数env_version），在开发过程中我们没有办法直接通过扫码来测试二维码是否正确生成和识别，因此我们需要在开发者工具内进行模拟测试。

模拟扫码进入小程序

启动参数可以用下面的函数生成

function getScene(queryString) {
  return 'scene=' + encodeURIComponent(queryString)
}

getScene('meetingId=1&userId=2')
// scene=meetingId%3D1%26userId%3D2

小程序内获取参数

解析参数的函数

function convertQueryStringToObject(queryString: string): Record<string, string> {
  return JSON.parse('{"' + queryString.replace(/&/g, '","').replace(/=/g, '":"') + '"}', function (key, value) {
    return key === '' ? value : decodeURIComponent(value);
  });
}

app.js

onLaunch(options) {
  console.log(options);
},
onShow(options) {
  console.log(options);
}

页面onLoad

onLoad(options) {
  console.log(options);
  let meetingId = '';
  if (options.scene) {
    const scene = convertQueryStringToObject(decodeURIComponent(options.scene));
    console.log(scene);
    meetingId = scene.meetingId;
  }
}