Chrome 50 中添加了对 Canvas toBlob() 的支持

从 Chrome 50 开始，画布元素将进行升级：它现在支持 toBlob() 方法！对于在客户端生成图片并希望将其上传到服务器或存储在 IndexedDB 中以供日后使用的开发者来说，这绝对是好消息。

function sendImageToServer (canvas, url) {

    function onBlob (blob) {
    var request = new XMLHttpRequest();
    request.open('POST', url);
    request.onload = function (evt) {
        // Blob sent to server.
    }

    request.send(blob);
    }

    canvas.toBlob(onBlob);
}

使用 toBlob() 非常有用，因为您现在可以直接处理编码后的二进制数据，而无需操控从 toDataURL() 获取的 base64 编码字符串。与数据 URI 相比，它更小，并且适用于更多用例。

如果您想知道能否将图片 blob 绘制到另一个画布上下文，答案是：在 Firefox 和 Chrome 中，绝对可以！您可以使用 createImageBitmap() API 执行此操作，该 API 也将在 Chrome 50 中发布。