上传图像字节而不是 Base64 表示

Question

给定 JavaScript 中的画布，保存到后端服务器的正常工作流程如下：

1. 创建画布元素
2. 绘制/修改画布
3. 调用canvas.toDataURL()
4. 将画布的 Base64 表示形式上传到后端服务器（基本 Ajax）。

由于对 toDataURL() 的调用可能非常慢，我想知道是否可以直接将图像字节上传到后端服务器，而不是使用 toDataURL() 的 base64 方式。

有任何想法吗？

Answer 1

使用返回 blob 或二进制对象的toBlob ，而不是 toDataURL。您可以将结果直接发送到服务器。虽然调用是异步的

myCanvas.toBlob(function(myBlob) {
  // send blob to server here!!
}, "image/jpeg", 0.5);

注意：较旧的 MS 不支持它，但请参阅顶部的垫片链接。不过，还有更好的垫片。