html - Is there a way to detect the start of a download in JavaScript? - Stack Overflow

admin管理员组

文章数量:1300028

In our current project we are providing a PDF download that can be customized by the user through an HTML form he submits. It takes several seconds to dynamically generate the PDF and I'd like to visualize this, e.g. by disabling the submit button until the download starts. Unfortunately, I couldn't find a way to detect when the download starts*. So I wouldn't know when to re-enable the submit button.

I already tried to specify an IFrame as the target of my HTML form, hoping that the onload event would be triggered. It is not, however -- probably because the PDF is sent with a "Content-disposition: attachment" header and it is not actually loaded into the IFrame.

The only solution I can think of right now involves generating the PDF to a temporary file on the server, which I would like to avoid.

*)Let me clarify this: I wouldn't need to know if the download was finished or even if it was really started. I'd like to detect the point at which the browser will ask the user whether to open or to save the file. I guess this happens when the browser receives the HTTP header.

In our current project we are providing a PDF download that can be customized by the user through an HTML form he submits. It takes several seconds to dynamically generate the PDF and I'd like to visualize this, e.g. by disabling the submit button until the download starts. Unfortunately, I couldn't find a way to detect when the download starts*. So I wouldn't know when to re-enable the submit button.

I already tried to specify an IFrame as the target of my HTML form, hoping that the onload event would be triggered. It is not, however -- probably because the PDF is sent with a "Content-disposition: attachment" header and it is not actually loaded into the IFrame.

The only solution I can think of right now involves generating the PDF to a temporary file on the server, which I would like to avoid.

*)Let me clarify this: I wouldn't need to know if the download was finished or even if it was really started. I'd like to detect the point at which the browser will ask the user whether to open or to save the file. I guess this happens when the browser receives the HTTP header.

• javascript
• html
• iframe
• download

Share Improve this question Follow edited Jan 7, 2009 at 15:19 cg. asked Jan 7, 2009 at 14:08 cg.cg. 3,67822 gold badges2828 silver badges3131 bronze badges 5

• Do you want to know when the download starts or when it pletes? Either way, I don't think that a temporary file will make a difference. On the client-side you can't tell if the file was sitting on the server or generated on the fly. – Prestaul Commented Jan 7, 2009 at 14:15
• So you submit the form, and the response to this submission is a PDF file? During the pause, the browser is in the mode where it's waiting for a response from the server? is this correct? – Breton Commented Jan 7, 2009 at 14:16
• @Breton: correct! @Pretaul: I'd like to know when the download starts. So, I could create a temp file, deliver some HTML response to the hidden IFrame, and then fetch the temp file by JavaScript in the onload handler. – cg. Commented Jan 7, 2009 at 15:12
• 1 I know you're already accepted an answer for this, but you might want to take a look at a blog post I did regarding this exact issue: gruffcode./2010/10/28/… – Jesse Taber Commented Feb 14, 2015 at 2:38
• @Jesse Using cookies for this is a clever idea indeed! Roughly 6 years too late for this case but it might be handy to remember. Thanks for the heads-up. – cg. Commented Feb 16, 2015 at 8:23

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

If I was you I would do an AJAX call to the server with the information, generate the file, then return the file name/id/whatever back to the javascript, which then makes window.location something like download.php?id=x (but the file was already generated, so it is just setting the headers and reading it out) at which point you can re-enable the submit.

What you want is to be able to detect when the size of the downloaded file changes from 0 to a positive value. As far as I know it is impossible to do that with javascript - you need a plug-in that can access the client's file system.

A remended work around: Create a session per download. Have the client poll the server about the status of the download. This could be "non existed", "not started", "started", "finished". You need some server's side work to persist and update the status of the download plus an AJAX framework.

The simplest solution would be to estimate the time (generously) and do it that way. It's a hack, but it gives the desired effect. The other option might be to submit the form with a callback using Ajax to submit the form and have the generator return details to the calling page. http://www.jquery./ might be a good place to start for that option.

本文标签： htmlIs there a way to detect the start of a download in JavaScriptStack Overflow