A brief discussion on how to create page QR codes in mini programs

How to create a page QR code in the mini program? The following article will introduce to you how to generate the QR code of the current page in WeChat Mini Program. I hope it will be helpful to everyone!

In the development of WeChat mini programs, in many business scenarios there is a need to generate a QR code and then scan the QR code to enter the specified page. [Related learning recommendations: 小program development tutorial]

I have never encountered this kind of demand before. I recently took on a private job and had this kind of demand. After checking the information, I found that the official one provides API, let’s do it below.

This is the introduction of the official document. I use cloud calling here.

First, create a new cloud function named QrCode in the cloud function folder. Write the following.

const cloud = require('wx-server-sdk')
cloud.init({
  env: '云环境ID',
})
exports.main = async (event, context) => {
  try {
    const result = await cloud.openapi.wxacode.createQRCode({
        path: '要跳转的页面路径',
        width: 430
      })
    return result
  } catch (err) {
    return err
  }
}

This is an example of the official document, you can modify it according to your situation.

Then we call this cloud function on the client side.

wx.cloud.callFunction({
  name:'QrCode',
  success(res){
    console.log(res);
  },
  fail(res){
    console.log(res);
  }
})

Look at what the res output here is.

res.result.buffer is what we want, because it is image data, so it is converted to buffertype of data. We need to do a conversion. Then put it into our cloud storage space.

The following is the complete code:

 wx.cloud.callFunction({
      name:'QrCode',
      success(res){
        console.log(res);
        const filePath = `${wx.env.USER_DATA_PATH}/test.jpg`;
        wx.getFileSystemManager().writeFile({
          filePath,
          data:res.result.buffer,
          encoding:'binary',
          success:() => {
            wx.cloud.uploadFile({
              cloudPath:'QrCodeA brief discussion on how to create page QR codes in mini programs',
              filePath,
              success(Res){
                console.log('success',Res);
              },
              fail(Res){
                console.log('fail',Res);
              }
            })
          }
        })
      },
      fail(res){
        console.log(res);
      }
    })

Look at the output again:

##We pass the conversion, and the last thing we want is this

fileID, this is the address where this QR code is stored in the cloud storage.

In this way, we actually generate the QR code of the specified page, and you can enter by scanning it. \

One thing to mention here is that this thing must be synchronized with the online version. For example, I am debugging this function on the development tool. The generated QR code will jump to the page

pages/index/index. If you scan this QR code now, the page will jump. The content of the page in your current online version may be inconsistent with that in your editor. If you have any questions, you can add my contact information to communicate.

For more programming-related knowledge, please visit:

Programming Teaching! !

The above is the detailed content of A brief discussion on how to create page QR codes in mini programs. For more information, please follow other related articles on the PHP Chinese website!