download img throught hyperlink in IE11 using javascript

The following code works well for Google Chrome but not for IE11.

<!DOCTYPE html>
<html>
<head>
    <title>title</title>
</head>
<body>
    <img id="img1" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAASUlEQVRo3u3PAQ0AIAwDsIGC+TcL
LkhOWgddSU6Ga5udT4iIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIi8cQEjUgGT
mE6z3QAAAABJRU5ErkJggg==" />
    <script>
        var a = document.createElement('a');
        var image = document.getElementById('img1');
        a.setAttribute('href', image.src);
        a.setAttribute("download", 'fileName');
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
    </script>
</body>
</html>

When I run this code in IE11 I've got message: "Do you want to allow this website to open an app on your computer?"

After clicking "Allow" I've got "No apps are installed to open this type of link (data)"

How to make it work in IE11?

This one is usefull for IE10+: http://msdn.microsoft.com/en-us/library/hh779016(v=vs.85).aspx

something like:

<!DOCTYPE html>
<html>
<head>
    <title>title</title>
</head>
<body>
    <img id="img1" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAASUlEQVRo3u3PAQ0AIAwDsIGC+TcL
LkhOWgddSU6Ga5udT4iIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIiIi8cQEjUgGT
mE6z3QAAAABJRU5ErkJggg==" />
    <canvas id="canvas1"></canvas>
    <script>
        var image = document.getElementById('img1');
        var canvas = document.getElementById('canvas1');
        var ctx = canvas.getContext('2d');
        ctx.drawImage(image, 0, 0, image.width, image.height);
        window.navigator.msSaveBlob(canvas.msToBlob(), 'drawingFileName.png');
    </script>
</body>
</html>

You cannot use this approach in IE, since even as of version 11 it doesn't suppport "download" attribute of anchor element: http://caniuse.com/download

You will have to resort to server-side to generate the image and send it to the client

来源：https://stackoverflow.com/questions/22665111/download-img-throught-hyperlink-a-in-ie11-using-javascript

标签

javascript

hyperlink

internet-explorer-11

download img throught hyperlink <a> in IE11 using javascript