使用javascript通过IE11中的超链接<a>下载图像答案

【问题标题】：download img throught hyperlink <a> in IE11 using javascript使用javascript通过IE11中的超链接<a>下载图像
【发布时间】：2014-03-27 17:14:00
【问题描述】：

以下代码适用于 Google Chrome，但不适用于 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>

当我在 IE11 中运行此代码时，我收到消息：“你想允许这个网站在你的计算机上打开一个应用程序吗？”

点击“允许”后，我得到“没有安装应用程序来打开这种类型的链接（数据）”

如何让它在 IE11 中运行？

【问题讨论】：

这只是意味着您没有可以处理数据的应用程序：IE中安装的协议。我得到 HTML1300：发生导航。文件：unknownprotocol.htm
@mplungjan，那么如何让它工作呢？
在您的 IE 上安装数据协议的处理程序？ - 在这里阅读 cmets msdn.microsoft.com/en-us/library/cc848897(v=vs.85).aspx
没有。显然这是IE的限制。 From msdn.microsoft.com/en-us/library/cc848897(v=vs.85).aspx “出于安全原因，数据 URI 仅限于下载的资源。数据 URI 不能用于导航、脚本或填充框架或 iframe 元素。”
@Yuriy Galanter，我可以在 IE11 中使用什么替代此代码？

标签： javascript hyperlink internet-explorer-11

【解决方案1】：

这个对IE10+有用：http://msdn.microsoft.com/en-us/library/hh779016(v=vs.85).aspx

类似：

<!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>

【讨论】：

【解决方案2】：

您不能在 IE 中使用这种方法，因为即使从版本 11 开始，它也不支持锚元素的“下载”属性：http://caniuse.com/download

您将不得不求助于服务器端来生成图像并将其发送到客户端

【讨论】：

我正在为 win8 商店开发一个应用程序，所以我没有服务器。该代码应该能够将即时生成的图像保存到用户的硬盘上。关于如何做到这一点的任何想法？
不是我的头顶，不是 HTML/JS。可以是原生 Win8 应用吗？
看看这是否有帮助：hackworthy.blogspot.com/2012/05/…我还没有阅读详细信息，但看起来像是跨浏览器支持
我忘记了blob！！！ stackoverflow.com/questions/4998908/…