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 でリリースされます。