[Mini program] Scan the external QR code to open the WeChat mini program and jump to the specified page

Scan the external QR code to open the WeChat applet and jump to the specified page

You need to use the jump link and related parameters provided by WeChat. Here are the steps to implement:

  1. Generate a jump link: Use the following link format to generate a jump link, where APPIDis the AppID of your mini program, PATHis the path of the page you want to jump to, and QUERYis the parameter you want to pass.
https://servicewechat.com/APPID/PAGE?QUERY
  1. Generate QR code: Use the generated jump link to generate a QR code. You can use an online QR code generation tool or programmatically generate a QR code.

  2. Scan the QR code: The user uses WeChat to scan the QR code generated.

  3. Jump to the specified page: When the user scans the QR code, WeChat will automatically open the mini program and jump to the specified page. onLoadIn the life cycle function of the specified page , optionsthe passed parameters can be obtained through parameters.

Here is an example:

// 生成跳转链接
var appId = 'your_appId';
var path = 'pages/detail/detail';
var query = 'id=123';
var jumpUrl = `https://servicewechat.com/${
      
      appId}/${
      
      path}?${
      
      query}`;

// 生成二维码
// ...

// 用户扫描二维码后,在指定页面中获取参数
Page({
    
    
  onLoad: function(options) {
    
    
    var id = options.id;
    // 在这里可以使用传递的参数进行逻辑处理
  },
  // 其他页面代码...
})

Please note that in order to generate jump links and open the mini program, you need to first register the mini program on the WeChat open platform and obtain the AppID.

Add parameters to the WeChat applet QR code and jump to the specified page

  • Add parameters to Parameters when generating a QR code path, and then parse and use these parameters in the mini program.

Here is an example:

  1. When generating a QR code, add parameters to pathParameters. For example, assuming you want to jump to the mini program pages/detail/detailpage and pass parameters id, you can generate a QR code like this:
var path = 'pages/detail/detail?id=123';
var qrCodeUrl = 'https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=' + encodeURIComponent(path);

In the above example, ensure that the parameters are passed correctly by adding them as in and encoding them pathwith ?.encodeURIComponent()

  1. In the target page of the mini program, onLoadthe passed parameters are obtained through the life cycle function and processed accordingly. For example, in pages/detail/detailthe page:
Page({
    
    
  onLoad: function(options) {
    
    
    var id = options.id;
    // 在这里可以使用传递的参数进行逻辑处理
  },
  // 其他页面代码...
})

In the above example, optionsthe passed parameter is obtained via parameter and assigned to idthe variable. You can perform subsequent logical processing on the parameters as needed.

Please note that the generated QR code needs to use the corresponding QR code generation tool or library, such as QR Code Generator API, zxing, etc.

Guess you like

Origin blog.csdn.net/gao511147456/article/details/132635532