收藏
回答

offscreenCanvas 真机调试 drawImage无法绘制video?

问题描述:type为2d offscreencanvas 的drawImage方法 image对象为video时,在真机调试下通过getImageData无法获取数据,开发工具可以获取。

不知原因是什么,不支持吗?

offscreenCanvas 和 canvas 应该都是 CanvasRenderingContext2D,麻烦解答一下。


代码调试片段:https://developers.weixin.qq.com/s/xTJLzsme7Jzd

回答关注问题邀请回答
收藏

2 个回答

  • Demons
    Demons
    2022-05-23

    你好请问你复现的手机是什么型号,我这边华为是可以获取数据的

    2022-05-23
    有用
    回复 4
    • Boom
      Boom
      发表于移动端
      2022-05-23
      IPhone 7. Plus.
      2022-05-23
      回复
    • Boom
      Boom
      发表于移动端
      2022-05-23回复Boom
      iOS. 版本号。15.4.1. WeChat 8.0.20
      2022-05-23
      回复
    • Boom
      Boom
      发表于移动端
      2022-05-23回复Boom
      Offscreencanvas. Image是可以绘制的
      2022-05-23
      回复
    • Zoro
      Zoro
      2022-08-16
      有结果了吗?
      2022-08-16
      回复
  • alpha
    alpha
    2023-01-06
    drawImage 绘制 video Demo
    
    query.select('#video0').context(res => {
           const video =  res.context
    
      const canvas = wx.createOffscreenCanvas({type: '2d', width: w, height: h})
      const context = canvas.getContext('2d')
            
      context.drawImage(video, 0, 0, w, h);
      //  将canvas画布内容转base64
      const base64 = context.canvas.toDataURL('image/png');
      // base64 to 本地地址
      const tempUrl = base64src(base64)
      // todo
      上传 或者 保存至相册
    }).exec()
    
    // 工具函数
    const base64src = (base64) => {
      const time = new Date().getTime();
      const imgPath = wx.env.USER_DATA_PATH + "/poster" + time + "share" + ".png";
      //如果图片字符串不含要清空的前缀,可以不执行下行代码.
      const imageData = base64.replace(/^data:image\/\w+;base64,/, "");
      const file = wx.getFileSystemManager();
      file.writeFileSync(imgPath, imageData, "base64");
      return imgPath
    };
            
    


    2023-01-06
    有用
    回复
登录 后发表内容