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，它較小，且適用於更多用途。

如果您想知道是否可以將圖片圓斑繪製到其他畫布內容，答案是肯定的，在 Firefox 和 Chrome 中皆可。您可以使用 createImageBitmap() API 執行這項操作，該 API 也已在 Chrome 50 推出。