https://developers.weixin.qq.com/miniprogram/dev/api/canvas/Canvas.createImage.html看下这个

https://developers.weixin.qq.com/miniprogram/dev/api/canvas/Canvas.createImage.html

接口更新了不能这样实现看看这个api

供参考

wxml

<canvas type="2d" style="{{canvasStyle}}" id="shareCanvas" canvas-id="shareCanvas"></canvas>


<view>
  <view class="help-title">长按图片, 保存到相册「发布到朋友圈」</view>
  <view class="share-image">
    <image  mode="widthFix" src="{{imagePath}}" bindtap="onImageTap"></image>
  </view>
</view>

JS

// 已这里定义的宽高为基准调整图片生成
const scale = 2
const canvasWidth = 300
const canvasHeight = 400


Page({
  /**
   * 页面的初始数据
   */
  data: {
    canvasId: 'shareCanvas',
    canvas: null, // 画布实例
    dpr: wx.getSystemInfoSync().pixelRatio * scale, // 缩放比例, 画布大小的缩放
    height: canvasWidth * scale,  // 图片高度
    width: canvasHeight * scale,  // 图片宽度
    coverHeight: 225 * scale,  // 封面图高度
    coverWidth: 300 * scale, // 封面图宽度
    canvasStyle: `width: ${canvasWidth * scale}px;height: ${canvasHeight * scale}px;background:#f8f8f8;position: fixed; top: ${-(canvasHeight * scale) - 200}px;`,
    imagePath: '',
    coverUrl: 'https://[网络图片地址].jpg'
  },


  // 初始化
  initCanvas: function () {
    const {canvasId  } = this.data
    wx.createSelectorQuery()
      .select(`#${canvasId}`)
      .fields({
        node: true,
        size: true,
      })
      .exec(this.createCanvas.bind(this))
  },


  // 创建画布
  async createCanvas (res) {
    const that = this
    const { width, height, node } = res[0]
    const { dpr } = this.data
    const canvas = node


    this.setData({ canvas })


    // 缩放
    canvas.width = width * dpr
    canvas.height = height * dpr
    const ctx = canvas.getContext('2d')
    ctx.scale(dpr, dpr)


    // 绘制背景
    ctx.fillStyle="#f8f8f8";
    ctx.fillRect(0, 0, width, height)
    ctx.font = `${16 *  scale}px "PingFangSC-Regular"`


    // 1. 绘制封面
    await this.drawPoster({ ctx, canvas })


    // 2. 绘制标题
    this.drawTitle({ ctx })
    
    // 生成图片
    wx.canvasToTempFilePath({
      canvas: canvas,
      fileType: 'png',
      success(res) {
        that.setData({ "imagePath": res.tempFilePath })
      },
      fail(e){
        console.log(e)
      },
      complete() {
        console.log('complete')
      }
    })
  },


  // 封面图
  async drawPoster ({ ctx, canvas }) {
    /**
     * coverWidth: 300
     * coverHeight: 400
     * coverUrl: http://your-domain/image-path.jpg
    */
    const { coverWidth, coverHeight, coverUrl } = this.data


    // 封面图底色
    ctx.fillStyle = "#eee";
    ctx.fillRect(0, 0, coverWidth, coverHeight);


    // 创建一个图片对象
    const coverImage = canvas.createImage()
    coverImage.src = coverUrl
    // 绑定onload事件
    let coverImageObject = await new Promise((resolve, reject) => {
      coverImage.onload = () => {
        resolve(coverImage)
      }
      coverImage.onerror = (e) => {
        reject(e)
      }
    })
    // 画图
    ctx.save()  // 保存上下文
    ctx.beginPath() // 创建一个路径
    ctx.rect(0, 0, coverWidth, coverHeight) // 画一个矩形区域
    ctx.clip() // 裁剪
    ctx.drawImage(coverImageObject, 0, 0, coverWidth, coverHeight) // 画图
    ctx.closePath()
    ctx.restore() // 恢复画布
  },


  // 画标题


  drawTitle ({ ctx }) {
    const { coverHeight } = this.data
    // 绘制标题
    ctx.fillStyle = '#333333'
    ctx.font = `${18 * scale}px "PingFangSC-Regular"`
    ctx.fillText('不敢相信仙境般美景停车如此便宜', 15 * scale, 40 * scale + coverHeight)
    ctx.fillText('省下钱吃一碗奇特的锅盖面', 15 * scale, 65 * scale + coverHeight)
  },


  // 点击图片
  onImageTap () {
    const { imagePath } = this.data
    wx.previewImage({
      urls: [imagePath],
      current: imagePath
    })
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {
    this.initCanvas()
  }
})

文档能不能更新明白点！！！，知道调这个问题耽误多长时间么。。。