如何在Internet Explorer中启动文件的自动下载?

77

如何在Internet Explorer中初始化自动下载文件?

例如,在下载页面中,我希望显示下载链接和提示消息:"如果您的下载没有自动开始……等等"。页面加载后应该很快开始下载。

在Firefox中,这很容易,您只需要在标头中包括一个meta标签,<meta http-equiv="Refresh" content="n;url">其中n是秒数,url是下载URL。但是这种方法在Internet Explorer中不起作用。我该如何在Internet Explorer浏览器中实现此功能?


有任何在Chrome中如何实现的想法吗? - iDebD_gh
19个回答

112

SourceForge 使用带有 src="" 属性指向要下载的文件的 <iframe> 元素。

<iframe width="1" height="1" frameborder="0" src="[File location]"></iframe>

副作用:不会重定向,不使用JavaScript,原始URL保持不变。


1
有人能解释一下应该如何工作吗?我没有看到延迟n秒... 预先感谢您。 - Budda
1
这似乎也是audible.com的做法。 - 3on
9
哦,那很聪明。你也可以将它设为 display:none。而且,@Budda,一些简单的JavaScript(噢,不,JavaScript?!)可以在n秒后添加HTML来下载文件:HTML: <iframe id="download" width="1" height="1" style="display:none"></iframe>JavaScript: function startDownload () { document.getElementById("download").src="[文件位置]"; } setTimeout (startDownload, n * 1000); - Cosine
3
我喜欢使用这个想法,但对于某些文件类型可能会有问题。例如,如果你想为PDF或图像(或任何浏览器可以显示的内容)提供下载链接,浏览器将尝试在隐藏的 iframe 中静默显示它。 - Nathan Hornby
7
在服务器端使用“Content-Disposition: attachment; filename=manual.pdf”头部就可以了,这样一切都会正常。 - zealotous
显示剩余6条评论

53

我讨厌网站把下载搞得很复杂,并且使用一些技巧而不是一个简单的下载链接

简化版:

<a href="file.zip">Start automatic download!</a>

它能够在每个浏览器中正常工作!


如果您想下载通常以内联方式显示的文件(例如图像),则HTML5具有一个download属性,可以强制下载该文件。它还允许您覆盖文件名(虽然有更好的方法来完成此操作):
<a href="report-generator.php" download="result.xls">Download</a>

带有“感谢”页面的版本:

如果您想在下载后显示“感谢”,请使用以下内容:

<a href="file.zip" 
   onclick="if (event.button==0) 
     setTimeout(function(){document.body.innerHTML='thanks!'},500)">
 Start automatic download!
</a>

这里的setTimeout函数可能更加先进,例如可以通过AJAX下载完整页面(但不要离开当前页面,不要触碰window.location或激活其他链接)。

重点是下载链接是真实的,可以复制、拖动、被下载加速器拦截,有:visited颜色,在浏览器重新启动后如果页面保持打开状态则不会重新下载等等。

这就是我用于ImageOptim的方法


9
我喜欢你回答的简洁明了。 - David Robbins
3
@DavidRobbins,我喜欢你评论的简洁。 :D - Vishwanath Dalvi
1
一个警告。至少在我的Chrome 21中,如果setTimeout的脚本尝试移动到另一页,则尝试跟随@href会被取消。因此,只有在您可以内联显示感谢页面时才能正常工作。 - Kohsuke Kawaguchi
2
我完全同意使用一个好的链接,但这里有一个问题:客户。有时候他们想要什么就是要什么,不管你怎么劝告。他们在其他网站上看到了这样的设计,就想在他们的网站上也这样做。 - raydowe
1
@porneL 我不明白。我以为你是建议只使用文件链接,而不是在 X 秒后自动下载。 - raydowe
显示剩余17条评论

24

我最近通过在页面中添加以下脚本成功解决了这个问题。

setTimeout(function () { window.location = 'my download url'; }, 5000)

我同意使用meta-refresh更好,但如果它不起作用,你该怎么办...


26
应该是 setTimeout(function () { window.location = '我的下载链接'; }, 5000)(请勿将字符串传递给 setTimeout)。 - sharat87
2
@Cerberus:因为一般的想法。 - Ralph
1
可能是最简单的解决方案。 - George Sovetov
或者像这样放在代码后面:Page.ClientScript.RegisterStartupScript(Me.GetType,“filedownload”,“setTimeout(function () { window.location = 'http://”&Page.Request.Url.Authority&filename&“'; }, 0)”,True) - user890332

22

我遇到了类似的问题,但以上解决方法都没有帮助我。这是我的尝试(需要jquery):

$(function() {
  $('a[data-auto-download]').each(function(){
    var $this = $(this);
    setTimeout(function() {
      window.location = $this.attr('href');
    }, 2000);
  });
});

用法:只需在指向所需下载的链接上添加一个名为data-auto-download的属性:

<p>The download should start shortly. If it doesn't, click
<a data-auto-download href="/your/file/url">here</a>.</p>

它应该在所有情况下都能正常工作。

1
我喜欢这个。简洁明了,你可以将它添加到任何想要的链接中。我喜欢发现data-*属性的新用途! - daGUY

8

一个简单的jQuery解决了我的这个问题。

$(function() {
   $(window).bind('load', function() {
      $("div.downloadProject").delay(1500).append('<iframe width="0" height="0" frameborder="0" src="[YOUR FILE SRC]"></iframe>'); 
   });
});

在我的HTML中,我只是简单地有:


<div class="downloadProject"></div>

这段代码的作用是等待1.5秒钟,然后将包含所需下载文件链接的iframe添加到div中。当iframe更新到页面上时,您的浏览器会自动下载该文件。就是这么简单 :D


6

适用于Chrome、Firefox和IE8及以上版本:

var link = document.createElement('a');
document.body.appendChild(link);
link.href = url;
link.click();

仅在来自相同来源的 Firefox 中工作,下载链接。 - ash123
@ash123 试试这个:function downloadURI(uri, name) { var link = document.createElement("a"); link.download = name; link.href = uri; link.click(); } - EL missaoui habib

6
我用了这个,似乎起作用,而且只是简单的JS,没有框架:
Your file should start downloading in a few seconds. 
If downloading doesn't start automatically
<a id="downloadLink" href="[link to your file]">click here to get your file</a>.

<script> 
    var downloadTimeout = setTimeout(function () {
        window.location = document.getElementById('downloadLink').href;
    }, 2000);
</script>

注意:此时开始计时器,是在页面加载的时候。


关于您的标记,这是需要在我们的网站上提出的问题。我相信这之前已经有人提过了(有很多类似的投诉,但我找不到一个直接匹配这个的)。 - Tim Post

5

以下是我在一些网站中使用的方法(需要jQuery):

$(document).ready(function() {
    var downloadUrl = "your_file_url";
    setTimeout("window.location.assign('" + downloadUrl + "');", 1000);
});

文件将在1秒后自动下载。

3

回到最初,我使用了这个:

<meta http-equiv="refresh" content="0; url=YOURFILEURL"/>

也许不符合WC3标准,但在所有浏览器上完美运行,无需HTML5/JQUERY/Javascript。
问候Tom :)

3

我希望这个功能可以在所有浏览器上正常运行。您还可以设置自动下载的时间。

<html>
<head>
<title>Start Auto Download file</title>
<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
<script>
$(function() {
$('a[data-auto-download]').each(function(){
var $this = $(this);
setTimeout(function() {
window.location = $this.attr('href');
}, 2000);
});
});
</script>
</head>
<body>
<div class="wrapper">
<p>The download should start shortly. If it doesn't, click
<a data-auto-download href="auto-download.zip">here</a>.</p>
</div>
</body>
</html>

1
这个答案救了我的一天。我有一个后续问题:如果我将“auto-download.zip”更改为像“https://dev59.com/93VC5IYBdhLWcg3w4VRz.html”这样的网址,它就不起作用了。我的目的是下载stackoverflow页面作为html。 - halfmoonhalf

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接