Menu
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?
230
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
30
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
