评论

【笔记】云开发实现小程序码生成及扫码访问对应页面

云开发实现生成小程序码,并根据小程序码进入指定页面。

通过云开发的云调用快速做出小程序码生成代码,小程序码有三种,其中有两种有数量限制,因此这里采用第三种wxacode.getUnlimited。

开发文档:https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/qr-code/wxacode.getUnlimited.html

配置config.json权限

{
  "permissions": {
    "openapi": [
      "wxacode.getUnlimited"
    ]
  }
}

云开发小程序生成,调用时传入页面路径(page)、页面参数(scene)

注意:这里踩过一个坑,line_color的rgb255其实是不生效的,因为小程序码线条颜色不能为白色,这样可能会造成无法识别。

try {
    const result = await cloud.openapi.wxacode.getUnlimited({
      'page': event.page,
      'width': 400,
      'scene': event.scene,
      // 'line_color': {
      //   "r": 255,
      //   "g": 255,
      //   "b": 255,
      // },
      'auto_color': false,
      'is_hyaline': false
     })
        
      //return result.buffer  //返回小程序码数据(buffer格式)
      const qrCode = await cloud.uploadFile({
        cloudPath: 'QRCode/' + event.scene + '.png',
        fileContent: result.buffer,
      }) //上传到云储存中
      const fileList = new Array(qrCode.fileID)
      console.log('文件Id', fileList)
      const tempUrl = await cloud.getTempFileURL({
    fileList
    }) //获取临时URL链接
    console.log('url链接', tempUrl.fileList[0].tempFileURL)
    return tempUrl.fileList[0].tempFileURL

  } catch (err) {
    console.log('生成失败', err)
    return err
  }

小程序端onload时根据二维码参数识别页面参数,访问对应对应页面获取数据

  onLoad: function (options) {
    if (options.id || options.scene) {
      console.time("请求指定数据")
      wx.cloud.callFunction({
        name: 'db',
        data: {
          'type': 'getById',
          'id': options.id || options.scene,
        }
      }).then(res => {
        console.timeEnd("请求指定数据")
        this.setData({
          cardData: [res.result]
        })
      })
    }
  },
最后一次编辑于  05-23  
点赞 0
收藏
评论
登录 后发表内容