How to start automatic download of a file in Internet Explorer?
Solution 1
SourceForge uses an <iframe>
element with the src=""
attribute pointing to the file to download.
<iframe width="1" height="1" frameborder="0" src="[File location]"></iframe>
(Side effect: no redirect, no JavaScript, original URL remains unchanged.)
Solution 2
I hate when sites complicate download so much and use hacks instead of a good old link.
Dead simple version:
<a href="file.zip">Start automatic download!</a>
It works! In every browser!
If you want to download a file that is usually displayed inline (such as an image) then HTML5 has a download
attribute that forces download of the file. It also allows you to override filename (although there is a better way to do it):
<a href="report-generator.php" download="result.xls">Download</a>
Version with a "thanks" page:
If you want to display "thanks" after download, then use:
<a href="file.zip"
onclick="if (event.button==0)
setTimeout(function(){document.body.innerHTML='thanks!'},500)">
Start automatic download!
</a>
Function in that setTimeout
might be more advanced and e.g. download full page via AJAX (but don't navigate away from the page — don't touch window.location
or activate other links).
The point is that link to download is real, can be copied, dragged, intercepted by download accelerators, gets :visited
color, doesn't re-download if page is left open after browser restart, etc.
That's what I use for ImageOptim
Solution 3
I recently solved it by placing the following script on the page.
setTimeout(function () { window.location = 'my download url'; }, 5000)
I agree that a meta-refresh would be nicer but if it doesn't work what do you do...
Solution 4
I had a similar issue and none of the above solutions worked for me. Here's my try (requires jquery):
$(function() {
$('a[data-auto-download]').each(function(){
var $this = $(this);
setTimeout(function() {
window.location = $this.attr('href');
}, 2000);
});
});
Usage: Just add an attribute called data-auto-download
to the link pointing to the download in question:
<p>The download should start shortly. If it doesn't, click
<a data-auto-download href="/your/file/url">here</a>.</p>
It should work in all cases.
Solution 5
A simple bit of jQuery solved this problem for me.
$(function() {
$(window).bind('load', function() {
$("div.downloadProject").delay(1500).append('<iframe width="0" height="0" frameborder="0" src="[YOUR FILE SRC]"></iframe>');
});
});
In my HTML, I simply have
<div class="downloadProject"></div>
All this does is wait a second and a half, then append the div with the iframe referring to the file that you want to download. When the iframe is updated onto the page, your browser downloads the file. Simple as that. :D
Comments
-
Pop Catalin almost 2 years
How do I initialize an automatic download of a file in Internet Explorer?
For example, in the download page, I want the download link to appear and a message: "If you download doesn't start automatically .... etc". The download should begin shortly after the page loads.
In Firefox this is easy, you just need to include a meta tag in the header,
<meta http-equiv="Refresh" content="n;url">
where n is the number of seconds andurl
is the download URL. This does not work in Internet Explorer. How do I make this work in Internet Explorer browsers? -
David Robbins almost 15 yearsI like the simplicity of your answer.
-
Budda almost 14 yearsThe lack of such approach is that browser waits for all banners loading... Sometime that takes some time and user is unable to get file due to stupid banners...
-
Budda almost 14 yearsCould somebody explain how that should work? I don't see delay for 'n' seconds... Thank you in advance.
-
sharat87 over 13 yearsshould be
setTimeout(function () { window.location = 'my download url'; }, 5000)
(no strings to setTimeout please) -
Vishwanath Dalvi over 11 years@DavidRobbins and i like the simplicity of your comment. :D
-
Tim Post over 11 yearsRegarding your flag, that would be something to raise on our meta site. I believe this has come up before, however (there are quite a few similar complaints, but I can't find one directly matching this)
-
Kohsuke Kawaguchi over 11 yearsOne word of caution. At least in my Chrome 21, the attempt to follow @href gets cancelled if the script from setTimeout tries to move to another page. So this really only works when you can show the thank you page inline.
-
daGUY over 11 yearsI like that. Nice and clean and you can add it to any link you want. I love finding cool new uses for the
data-*
attribute! -
Ralph over 11 years@Cerberus: because of the general idea.
-
raydowe over 11 yearsI totally agree with using a good old link, but there is a problem with this: clients. Sometimes they want what they want no matter what you try and tell them. They've seen it on other sites, and that's what they want on their site.
-
Kornel over 11 years@raydowe if you make link work well, then the client won't know. Unless you have clients that view page source and make nonsensical complaints…
-
raydowe over 11 years@porneL I don't understand. I thought you were suggesting just using a link to the file INSTEAD of the automatic download after X seconds.
-
Kornel over 11 years@raydowe yes, but you can display post-download screen that looks the same as if it was implemented using the messy meta/iframe hack — load the 'thank you' page using AJAX from onclick handler. So if client's requirement is to have such page, you can use the link and still fulfill the requirement.
-
3on almost 11 yearsThis is also how audible.com does it apparently.
-
Cosine over 10 yearsOoh that is clever. You could make it
display:none
, too. Also, @Budda, some simple Javascript (Oh, no, Javascript?!?!) can add that HTML in after n seconds: HTML:<iframe id="download" width="1" height="1" style="display:none"></iframe>
Javascript:function startDownload () { document.getElementById("download").src="[File Location]"; } setTimeout (startDownload, n * 1000);
-
Dmitriy Konovalov over 10 yearsBrilliant! Thanks for the tip!
-
George Sovetov almost 10 yearsProbably, the most simple solution.
-
Cheruvian over 9 yearsThe problem is currently safari, notice user wants to automatically start the download and the only way to do that with a link is to snag the element and invoke .click(). safari doesn't support click().
-
Kornel over 9 years@Cheruvian think what action user takes before you "automatically" start the download. I'll bet that action is a click that goes to your "automatic" page. So move the download one step earlier!
-
Cheruvian over 9 yearsTrue but the issue is when you need to generate download content based on something. The current solution is 1 click for generating content and 1 click to download which can be pretty dirty
-
Nathan Hornby over 9 yearsI like the idea of using this, but it will have issues with certain file types. For example if you wish to provide a download link for a PDF or image (or any content that a browser can display), the browser would just try and display it silently in the hidden iframe.
-
Bogdan Varlamov over 9 yearsOften times you need to do additional work before the download actually starts--like submitting various parameters from JS to an API so that you can prepare the file for downloading. You can't really do that if it's just an href that the user is clicking which links directly to the file content.
-
Kornel over 9 years@BogdanVarlamov: You could include the data in the URL (dynamically modify
href
if necessary) and have that URL redirect to actual file, e.g.<a href="/api?param=meters&redirect=/download/file">
. You can even changehref
fromonclick
handler and returntrue
, so you can update it the instant user clicks. -
zealotous over 9 years@NathanHornby, use
Content-Disposition: attachment; filename=manual.pdf
header on server side and everything will be ok. -
Bogdan Varlamov over 9 years@porneL: Then one is sending potentially sensitive data in an insecure manner (via URL) instead of being able to send it in the body over HTTPS.
-
Kornel over 9 years@BogdanVarlamov HTTPS is a tunnel hiding all of HTTP protocol, including URLs, so there's no difference. And if filename contains sensitive information, maybe don't put that in the filename anyway? (it'll leak later when saved to disk)
-
Bogdan Varlamov over 9 yearsThere are some issues specifically related to URLs which are not typically encountered for body params. Check out stackoverflow.com/questions/323200/… and blog.httpwatch.com/2009/02/20/… for reasons
-
Kornel over 9 years@BogdanVarlamov 1. GET via click vs GET via javascript/iframe hack is still GET (and issues like cross-site referrer leak don't apply to download links you create). 2. sensitive information should go to a cookie with
secure
flag, and then you won't need to worry about hiding potentially-insecure URL hacks with wonky JS hacks. -
Bogdan Varlamov over 9 years@porneL, Nobody forces you to use a GET method in JS. You can (and should) use a POST/PUT to submit the sensitive parameters in JS in the BODY (see my first comments)... with a url-click you are limited only to the GET the browser sends.
-
Kornel over 9 years@BogdanVarlamov You can still use
<form method="post"><button>
for JS-hack-free equivalent of<a href>
. Other answers to this question use frames orlocation.href
and don't account for POST anyway. -
Bogdan Varlamov over 9 years@porneL, I think what I imagine is a POST/PUT that submits sensitive info which returns a URL based on that criteria which you sent, that the JS client then redirects to for executing the file download. You can avoid this by sticking the sensitive info into the URL as params, sure, but that has security problems as I pointed out. Are you saying that if you had a form submit the params, you could have the server redirect to the right file based on the params?
-
Kornel over 9 years@BogdanVarlamov POST can send the file to download directly, so there's never need to perform any redirect or put any parameters in any URL at any point, e.g. see imageoptim.com/mozjpeg
-
user890332 over 8 yearsor put into code behind like this: Page.ClientScript.RegisterStartupScript(Me.GetType, "filedownload", "setTimeout(function () { window.location = 'http://" & Page.Request.Url.Authority & filename & "'; }, 0)", True)
-
ash123 about 7 yearsworks in firefox only if its from the same origin download link
-
EL missaoui habib about 7 years@ash123 try this : function downloadURI(uri, name) { var link = document.createElement("a"); link.download = name; link.href = uri; link.click(); }
-
Shi Jie Tio almost 7 yearsHow to apply in IE 11, I really no idea on it can anyone share this to me?
-
Teson almost 7 yearsIE: pointing the iframe to a src of stackoverflow.com/questions/24529910/… (Cendak) solved this for me.
-
Robo Robok about 6 yearsWhy is
Content-Disposition
better thandownload
attribute for setting file name? -
mix3d over 4 yearsExcept for some browsers + the content is one that could be viewed directly in the browser (like video files), does not actually force the download in all circumstances.
-
mix3d over 4 yearsNot all browsers let you click an anchor tag with JS. Safari, for example, especially if the url is cross-domain
-
johny why about 4 years@zealotous Where on the server do you put
Content-Disposition: attachment; filename=manual.pdf header on server side
? -
halfmoonhalf almost 4 yearsThis answer saves my day. I have a follow up question: if I change "auto-download.zip" to a url like "stackoverflow.com/questions/156686/…", it does not work. My purpose is to download the stackoverflow page as html.
-
JDQ almost 3 yearsI really like the
href=<handler> download=<output>
usage: I have only ever seendownload
used as an attribute without the optional value. -
Chris - Jr over 2 years@johnywhy, you place in the header of the server response. So in pseudocode -
myResponse.setHeader('Content-Disposition','attachment; filename=manual.pdf'); send(myResponse);