javascript - download a file and wait for it to finish

Question

I have looked in many threads but cannot find an answer that works with current chrome & IE ...

I want to download a file (from the same domain as the page, no CORS issues) and save it locally and I also need a callback when the download is done in order to turn off my 'downloading' notification.

I tried with a hidden iframe like this:

// to download a file we don't want to use window.location.assign because in case of error the broswer
// will redirect to the error page, instead we create an invisible iframe and set src to it
function downloadToFile(url, done) {
    const iframe = document.createElement('iframe');
    iframe.style.display = 'none';
    document.body.appendChild(iframe);
    iframe.setAttribute('src', url);

    if (done) {
        const doc = iframe.contentDocument || iframe.contentWindow.document;
        const inter = setInterval(() => {
            if (doc.readyState === "complete") {
                clearInterval(inter);
                done();
            }
        }, 50);
    }
}

However this does not work - Chrome seems to set the iframe's readyState to 'complete' immediately and so done is called while the file is still loading.

How can this be achived ?

(I also tried to hook a 'load' event but it seems it is not called in chrome and the standard says no iframe events are guaranteed).

That's not a download. `iframeElement.contentWindow.onload = function(){ /* load of the iframe has occurred */ }`. If you want do see when a download is complete use the [FileReader API](https://developer.mozilla.org/en-US/docs/Web/API/FileReader/onload) — StackSlave, Oct 26 '17 at 03:38
As far as I know you can't tell. You can't even tell if it was canceled by user or not. One option to leverage the unknown waiting time is to load the file in memory first as a Blob, then use an `` (or `msSaveOrOpenBlob` in IE) to download it from the memory. This way, you would avoid the fetching time, but you will still don't know exactly what happens after the user has been shown the download dialog. — Kaiido, Oct 26 '17 at 03:39
@PHPglue while it's an old trick, iframes were one of the preferred ways to dowwload a file prior to FileAPI. Also, what would you do with a FileReader here? — Kaiido, Oct 26 '17 at 03:42

javascript - download a file and wait for it to finish

0 Answers0