项目有一个使用二维码图片(远程url)生成海报的功能,基于微信的画布(canvas)接口实现,开发者工具生成无问题,到真机后发现图片未绘制出来( 准确的说的绘制后保存tempFile没有图片,但文字内容都是ok的 )。经过一番摸索猜测原因为真机canvas无法实时绘制远程图片资源(可能是异步、执行顺序的问题?)。
通过以下方式解决:
先使用getImageInfo接口预加载远程图片,让后用预加载的缓存图片进行绘制。
示例代码:
let ctx = wx.createCanvasContext('your-canvas-id')
let remote_url = 'https://xxx.com/your-image.png';
wx.getImageInfo({
src : remote_url,
success : res => {
//res.path 为getImageInfo预加载的缓存图片地址
ctx.drawImage( res.path , x, y, w, h);
}
});
附加一条:资源为https,否则上线后可能拿不到资源哦(域名限制:开发环境、开启调试都可以)
2024年了,这个问题解决了吗
2024年了,这个问题解决了吗
现在这个问题都没有解决
用了这个方法同样不显示
同样有这个问题,有解决方案么?
没用
难道一开始不应该放到回调里面吗,,
就算你在web上开发也是要把drawImage放在你new Image的onlond回调里啊。
码
这个坑我也遇到了...