onShareAppMessage用canvas自定义分享图imageUrl，在开发者工具上显示正常，在真机上模拟的时候，图片一直获取不到是为什么

canvasImage (url) {
      const that = this;
      await wx.getImageInfo({ src: url,
        success (res) {
          var data = res
          wx.createSelectorQuery()
          .select('#shareCanvas')
          .fields({ node: true, size: true })
          .exec((res) => {
            const canvas = res?.[0]?.node
            const ctx = canvas.getContext('2d')
            let {width, path, height} = data
            var widths = height*5/4
            const dpr = wx.getWindowInfo().pixelRatio
            canvas.width = widths * dpr
            canvas.height = height * dpr
            ctx.scale(dpr, dpr)
            ctx.clearRect(0, 0, widths, height)
            const w = (widths - width) / 2
            const image = canvas.createImage()
            image.onload = () => {
              ctx.drawImage(image, w, 0)
              wx.canvasToTempFilePath({
                canvasId: 'shareCanvas',
                x: w,
                width: widths * dpr,
                height: height * dpr,
                canvas,
                success: async (res) => {
                  const tempFilePath = res.tempFilePath
                  that.setData({
                    shareImgUrl: tempFilePath
                  });
                },
                file: (err) => {
                console.log(err, 'errwreew')
                }
              })
            }
            image.onerror = (err) => {
              console.log(err, 'trtrtrtrtrtr')
            }
            image.src= path
          })
        },
      })
    }
onShareAppMessage() {
    return {
      path: home,
      title: '测试',
      imageUrl: this.shareImgUrl,
    }
  },