在IE中本地保存画布

Question

嗨,我想在IE中本地保存画布.

  var img = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");

我无法通过以下方式下载它.

1) document.execCommand("SaveAs"..
2) window.location.href = img;
3) $.fileDownload(img);  // jquery download file library-
4) canvas2image // cross domain problem.

有没有办法在没有base64或跨域问题的IE中本地保存画布？非常感谢你.

Answer 1

我知道这已经很晚了，但是我在搜索中偶然发现了这个问题来做同样的事情，我想分享一个对我有用的解决方案。

假设您已经有一个数据 URI，您可以创建一个blob，然后使用msSaveBlob或msSaveOrOpenBlob

例子：

dataURItoBlob = function(dataURI) {
        var binary = atob(dataURI.split(',')[1]);
        var array = [];
        for(var i = 0; i < binary.length; i++) {
            array.push(binary.charCodeAt(i));
        }
        return new Blob([new Uint8Array(array)], {type: 'image/png'});
    }

var blob = dataURItoBlob(uri);
window.navigator.msSaveOrOpenBlob(blob, "my-image.png");

我将此答案用于我的大部分解决方案。

键入此内容后，我意识到这并不能真正帮助您解决跨域问题，因此充其量只是部分答案。有了这个，我能说的就是考虑在可能的情况下使用数据 URI，如果跨域是一个问题。

Answer 2

好吧，看起来这在 IE 中也不起作用，但既然你没有列出它，我将提供一个例子。这使用了HTML5download属性（更多信息请参见此处），并允许用户单击链接然后下载文件。

<a href="data:text/html;base64,PCF...." download="file.png"></a>