生成小程序URLScheme

发布时间：2023-05-18

一、生成小程序URLScheme

小程序URLScheme是小程序特有的一种链接方式，可以实现在微信内跳转到指定的小程序页面。为了方便用户在微信中打开小程序，生成小程序URLScheme是必不可少的。 生成小程序URLScheme非常简单，只需要在小程序后面加上特定的参数就可以了。例如，我们需要在微信中打开一个名为“example”的小程序的“homepage”的页面，那么生成的URLScheme就是：weixin://dl/miniprogram/launch?appid=wx0123456789abcdef&path=/pages/homepage/homepage。其中，wx0123456789abcdef是小程序的AppID，/pages/homepage/homepage是页面的路径。

//生成小程序URLScheme的函数
function generateMiniProgramURLScheme(appid, path) {
  return 'weixin://dl/miniprogram/launch?appid=' + appid + '&path=' + encodeURIComponent(path);
}
//调用生成小程序URLScheme的函数，生成URLScheme
var miniProgramURLScheme = generateMiniProgramURLScheme('wx0123456789abcdef', '/pages/homepage/homepage');

二、生成小程序页面二维码

为了方便用户在手机上快速打开小程序页面，可以生成小程序页面二维码。用户只需要扫描二维码就可以在微信中打开对应的小程序页面。 生成小程序页面二维码需要用到一个第三方库qrcode.js，这个库可以将字符串转换成二维码图像。

//生成小程序页面二维码的函数
function generateMiniProgramPageQRCode(appid, path, size) {
  var url = generateMiniProgramURLScheme(appid, path);
  var qrcode = new QRCode(document.getElementById("qrcode"), {
    text: url,
    width: size ? size : 128,
    height: size ? size : 128
  });
}
//调用生成小程序页面二维码的函数，生成二维码
generateMiniProgramPageQRCode('wx0123456789abcdef', '/pages/homepage/homepage', 256);

三、生成小程序砖

小程序砖是一种可以通过手机NFC功能扫描打开小程序的方式。使用小程序砖可以让用户更加方便地打开对应的小程序。 生成小程序砖需要用到一个第三方库nfc-uri，这个库可以将URL转换成NFC格式。

//生成小程序砖的函数
function generateMiniProgramBrick(appid, path, name) {
  var url = generateMiniProgramURLScheme(appid, path);
  var nfc = nfcuri.encode(url, {name: name ? name : '小程序'});
  return nfc;
}
//调用生成小程序砖的函数，生成小程序砖
var miniProgramBrick = generateMiniProgramBrick('wx0123456789abcdef', '/pages/homepage/homepage', 'example小程序');

四、生成小程序链接

生成小程序链接可以在其他平台上分享小程序页面链接，例如在微博、QQ、Facebook等平台上分享小程序页面链接。 生成小程序链接需要用到一个第三方库query-string，这个库可以将对象转换成URL查询参数。

//生成小程序链接的函数
function generateMiniProgramLink(appid, path, extraData) {
  var url = generateMiniProgramURLScheme(appid, path);
  var obj = {path: path};
  if (extraData) {
    obj.extraData = JSON.stringify(extraData);
  }
  var queryString = querystring.stringify(obj);
  return 'https://mp.weixin.qq.com/mp/waapp/index.html?' + queryString + '#wechat_redirect';
}
//调用生成小程序链接的函数，生成小程序链接
var miniProgramLink = generateMiniProgramLink('wx0123456789abcdef', '/pages/homepage/homepage', {from: 'share'});

五、小程序生成

在小程序中，可以通过调用微信的API wx.navigateToMiniProgram进行跳转到其他小程序。为了方便其他开发者调用我们的小程序，需要提供小程序生成功能，也就是生成可以调用我们小程序的URLScheme。 小程序生成同样非常简单，只需要将生成的URLScheme返回即可。

//小程序生成的函数
function onGenerateMiniProgram(event) {
  var miniProgramURLScheme = generateMiniProgramURLScheme('wx0123456789abcdef', '/pages/homepage/homepage');
  event.reply(miniProgramURLScheme);
}

六、生成小程序码

生成小程序码可以让用户通过扫描二维码来打开小程序，与生成小程序页面二维码的功能类似。 生成小程序码需要用到一个第三方库wxapp-qrcode，这个库可以将小程序的AppID和页面路径转换成小程序码图像。

//生成小程序码的函数
function generateMiniProgramCode(appid, path, size) {
  var url = generateMiniProgramURLScheme(appid, path);
  var qrcode = new WxappQrcode({
    draw: 'canvas',
    canvasId: 'qrcode',
    size: size ? size : 280,
    fit: true,
    typeNumber: 10,
    correctLevel: 'H',
    background: '#ffffff',
    foreground: '#000000',
    text: url
  });
}
//调用生成小程序码的函数，生成小程序码
generateMiniProgramCode('wx0123456789abcdef', '/pages/homepage/homepage', 320);

七、生成小程序带参二维码

小程序带参二维码可以在打开小程序时携带一些附加信息，例如分享者的OpenID等，可以用于统计推广效果等。 生成带参二维码需要用到一个第三方库qrcode-with-logo，这个库可以将字符串和logo图片合成为一张带参二维码图像。

//生成小程序带参二维码的函数
function generateMiniProgramParamQRCode(appid, path, scene, size) {
  var url = generateMiniProgramURLScheme(appid, path) + '&scene=' + encodeURIComponent(scene);
  var qrcode = new QRCodeWithLogo({
    content: url,
    width: size ? size : 256,
    height: size ? size : 256,
    logo: 'https://example.com/logo.png',
    logoWidth: 60,
    logoHeight: 60
  });
  return qrcode;
}
//调用生成小程序带参二维码的函数，生成小程序带参二维码
var miniProgramParamQRCode = generateMiniProgramParamQRCode('wx0123456789abcdef', '/pages/homepage/homepage', '12345678');
var qrcodeImage = miniProgramParamQRCode.toDataURL();

八、生成小程序链接快捷指令

在iOS 12中，可以使用Siri Shortcuts的快捷指令功能创建一个可以在Siri中直接唤起小程序的快捷指令。为了方便用户创建快捷指令，在小程序中可以生成小程序链接快捷指令。 生成小程序链接快捷指令需要用到一个第三方库shortcut-generator，这个库可以将小程序的AppID和页面路径转换成一个可以导入到Siri中的快捷指令文本。

//生成小程序链接快捷指令的函数
function generateMiniProgramShortcut(appid, path, name) {
  var url = generateMiniProgramURLScheme(appid, path);
  var shortcut = ShortcutGenerator.create({
    name: name ? name : 'example小程序',
    bundleId: 'com.example.miniprogram',
    url: url,
    icon: 'https://example.com/icon.png'
  });
  return shortcut;
}
//调用生成小程序链接快捷指令的函数，生成小程序链接快捷指令
var miniProgramShortcut = generateMiniProgramShortcut('wx0123456789abcdef', '/pages/homepage/homepage', 'example小程序');
推荐文章