将画布保存到图像，然后将其保存在设备上

Question

我正试图找到一种方法来捕获画布并将其保存在设备上（任何设备 - 移动设备和桌面设备）。

现在我第一部分遇到了困难（还没到第二部分......）

我正在尝试blob功能，但我得到的只是一个黑色方块 - 即使画布上的背景是灰色或黄色......

var canvas = document.getElementById("myCanvas");
var imagData;


var dataURL = canvas.toDataURL( "image/png" );
var data = atob( dataURL.substring( "data:image/png;base64,".length ) ),
       asArray = new Uint8Array(data.length);

for( var i = 0, len = data.length; i < len; ++i ) {
    asArray[i] = data.charCodeAt(i);    
}

var blob = new Blob( [ asArray.buffer ], {type: "image/png"} );

var img = document.createElement("img");
img.src = (window.webkitURL || window.URL).createObjectURL( blob );
document.body.appendChild(img);

如何使用所有图形捕获画布？ 然后，如何将其保存在设备上？

提前致谢