canvas压缩图片后返回的base64的图片有几率会是黑色或者白色的

Question

问题遇到的现象和发生背景

vant-upload 上传图片在after-read中使用canvas压缩图片有几率是纯黑或者纯白的图片

问题相关代码，请勿粘贴截图

    const canvas = document.createElement('canvas') // 创建Canvas对象(画布)
    const context = canvas.getContext('2d')
    const img = new Image()
    img.src = file.content // 指定图片的DataURL(图片的base64编码数据)
    img.onload = () => {
      canvas.width = img.width
      canvas.height = img.height
      context.drawImage(img, 0, 0, img.width, img.height)
      file.content = canvas.toDataURL(file.file.type, 0.1) // 0.92为默认压缩质量
      const files = this.dataURLtoBlob(file.content, file.file.name)
      upLoadImgFuc(files, list)
    }

运行结果及报错内容

压缩之后的图片有几率是纯黑或者纯白

我的解答思路和尝试过的方法

我想要达到的结果

Answer 1

问题找到了 ios不执行img.onload方法