JavaScript:将base64解码为二进制数据

Question

我正在尝试使用 Canvas 从视频创建图像，然后将图像发送到 API。

这是我的代码(为简洁起见，省略了大部分内容)

      var image = new Image();
        image.src = canvas.toDataURL("image/png");

      var newFile = new File([atob(image.src)], lorem.png, {
         type: "image/png",
          lastModified: Date.now()
         })

image.src 是一个长字符串，格式似乎是 base64 data:image/png;base64

[数据链接][1]: https://gist.github.com/anonymous/d357e780fa60b2c47490a9f795e34acf

当我尝试使用函数 atob 将数据解码为二进制时，出现以下错误:

Error: Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.

我不清楚 Base64 数据的哪一部分格式不正确。

Answer 1

您必须删除数据网址的头部。当您将图像放入 image.src 时，其内容类似于 data:image/png;base64,BASE64ENCODEDSTUFF。 显然 data:image/png;base64 不是 base64，因此使用 atob 对其进行解码将会失败。