saving canvas locally in IE

Question

Hi I want to save a canvas locally in IE.

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

I cou

Answer 1

Well, it looks like this doesn't work in IE either, but since you've not listed it, I'll provide an example. This uses the HTML5 download attribute (more here), and allows the user to click a link which then downloads a file.

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

Answer 2

I know this is late, but I stumbled on this question in my search to do the same thing and I wanted to share a solution that's working for me.

Assuming you have a data URI already, you can create a blob and then use msSaveBlob or msSaveOrOpenBlob

Example:

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");

I used this answer for a bulk of my solution.

After typing this, I realize this doesn't really help you with the cross domain issue, so it's a partial answer at best. With that, all I can say is consider using data URIs where possible, if cross domain is an issue.