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

问题描述：

我试图通过使用画布从视频创建图像，然后将图像发送到API。JavaScript：将base64解码为二进制数据

这是我的代码（大部分为简洁起见省略了）

 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数据：图像/ 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数据的哪一部分没有正确格式化。

答

你必须削减数据url的头部。当你把图像放入image.src中时，它的内容就像data:image/png;base64,BASE64ENCODEDSTUFF。 Obsviously data:image/png;base64，不是base64所以用atob解码会失败。

答

这不会起作用，因为data-uri包含一个头，然后是Base-64数据 - atob（）只能处理Base-64部分。这意味着你需要切断标题（“data：image/png; base64，”）。

但是，通过Data-URI进行速度较慢，浪费的内存超过所需。直接使用blob - 这是如何：

var img = new Image(); 

canvas.toBlob(function(blob) { 
    var newFile = new File([blob], "lorem.png", {type: "image/png"}); 
    img.src = (URL || webkitURL).createObjectURL(blob); 
    // ... 
});

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

相关推荐