评论

彻底解决canvasToTempFilePath 无法获取到图片(获取到空白图片、黑色图片、canvasid不存在)等等

彻底解决canvasToTempFilePath 无法获取到图片(获取到空白图片、黑色图片、canvasid不存在)等等所有问题,代码是uniapp的,微信小程序把 uni 换成 wx 即可

canvasToTempFilePath 的坑太多了,不同环境有不同的坑,不同版本的canvas接口有不同的坑,为了彻底解决这些问题最好的方法就是不用它。

直接用toDataURL获取base64图像数据,然后再写入临时文件即可

// 获取base64图像
const b64Data = this.ctx.canvas.toDataURL()
const time = new Date().getTime();
const filePath = `${uni.env.USER_DATA_PATH}/temp_image_${time}.png`
// base64格式的图片要去除逗号前面的部分才能正确解码
const buffer = uni.base64ToArrayBuffer(b64Data.substring(b64Data.indexOf(',') + 1))
// 写入临时文件
uni.getFileSystemManager().writeFile({
	filePath,
	data: buffer,
	encoding: 'utf8',
	success: res => {
		console.log('保存图片:', filePath)
	}
})
最后一次编辑于  2022-05-24  
点赞 4
收藏
评论

4 个评论

  • DF
    DF
    2022-06-15

    pc小程序 toDataURL canvasToTempFilePath都无反应且生成失败也不报错

    2022-06-15
    赞同 2
    回复 2
  • 芋头
    芋头
    2023-04-26

    可行,可以不用base64ToArrayBuffer,直接写base64,encoding:'base64'

    2023-04-26
    赞同
    回复
  • 神经蛙
    神经蛙
    2022-11-02

    感谢

    2022-11-02
    赞同
    回复
  • LW
    LW
    2022-05-27

    没用,安卓还是空白

    2022-05-27
    赞同
    回复
登录 后发表内容