扫普通链接二维码进入小程序

一、项目需求

最近公司项目有个需求，在PC端扫描二维码进入小程序的指定页面，一开始以为没这个方法，毕竟将近一年没做小程序了，试着到官方文档查看了一下，确实提供了扫普通二维码进入小程序，官方文档：扫普通二维码进入小程序

二、实现步骤

通读了两三遍文档，个人觉得大体分三步，来实现项目需求。

step1：开启扫描二维码打开小程序

登录小程序后台，进入“开发-开发设置-扫普通链接二维码打开小程序”，开启功能后即可配置二维码规则。

step2：配置二维码

1、填写二维码

二维码规则：

• 二维码规则的域名须通过ICP备案的验证。
• 支持http、https、ftp开头的链接（如：http://wx.qq.com、https://wx.qq.com/mp/、https://wx.qq.com/mp?id=123）
• 一个小程序帐号可配置不多于10个二维码前缀规则。

2、校验文件

下载随机校验文件，并将文件上传至服务器指定位置的目录下，方可通过所属权校验。

我是在服务器指定目录新建一个文件夹，然后把随机生成的xxx.txt文件上传到这个目录，然后根据二维码规则配置，例如：http://ok2etest.xinyusoft.com/weShare/test/?id=111。

注意：上线时需要配置https开头的链接。配置时可使用原来的xxx.txt校验文件，因为生成的文件是一样的。

3、小程序功能页面

小程序功能页面可打开指定页面，扫描二维码可打开对应页面。

step3：扫描二维码打开小程序

配置二维码时可配置测试链接，利用第三方二维码生成工具，使用测试链接生成二维码，利用微信“扫一扫”或微信内长按识别二维码跳转小程序。

链接?后为参数部分，可在onLoad事件中提取q参数并自行decodeURIComponent一次，即可获取原二维码的完整内容。

onLoad: function (options) {
    if (options.q) {
      let queryAll = decodeURIComponent(options.q);
      let id = gup('id', queryAll);
      //console.log(queryAll);
      //console.log(id);
    }
  },

/**
 * 获取URL中某个字符串字段
 * gup('id', 'https://www.lubanso.com/wx/home/?id=bHViYW5zb7W7DJI=&jhkfdhkjfda')
 * //===> bHViYW5zb7W7DJI=
 */
function gup(name, url) {
  if (!url) url = location.href;
  name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
  var regexS = "[\\?&]" + name + "=([^&#]*)";
  var regex = new RegExp(regexS);
  var results = regex.exec(url);
  return results == null ? null : results[1];
}

三、注意事项

• 开放范围：企业、媒体、政府及其他组织类型小程序。
• 对于普通链接二维码，目前支持使用微信“扫一扫”或微信内长按识别二维码跳转小程序。
• 上线时需要配置https开头的链接，并且配置指定域名。
• 上线时，需要发布二维码规则才可使用。
• 填写符合二维码前缀匹配规则的二维码完整链接用于测试，如包括参数，请完整填写。

GitHub地址，欢迎start：
扫描普通二维码打开小程序实例

参考文章：
扫描普通二维码打开小程序