CODEWITHSUNDEEP
javascriptajaxdownload
psychotik
psychotik

Reputation: 39019

Download binary without triggering onbeforeunload

I want to kick off a file download for a user when he clicks a link, but I have an onbeforeunload handler that I don't want to get invoked when the download begins. To downloads, I currently have an <a> with the href set to the file location but clicking it results in onbeforeunload being invoked in Chrome (not in FF, though).

I know I can set a private flag and check that in the onbeforeunload handler, but is there some way to kick off the download using ajax? I still want the user to see the usual dialogs when they download the file (Open/Save etc).

Ideas?

Upvotes: 12

Views: 6096

Answers (5)

Bob Kanefsky
Bob Kanefsky

Reputation: 121

The download attribute answer worked well for me, but before I noticed it, I tried this, which also works. Just in case it's useful in some other cases that aren't download links.

var linksThatDisableWarning = $('a'); // all links
linksThatDisableWarning.on('mousedown', () =>
    window.isclicking = true);
linksThatDisableWarning.on('mouseup', () =>
    setTimeout(() => window.isclicking = false, 200))
window.addEventListener('beforeunload', (event) => {
  if (window.isclicking) return;
  event.preventDefault();
  event.returnValue = '';
});

Upvotes: 0

tgallard
tgallard

Reputation: 401

The best way to do this is indeed by constructing an iframe and triggering the download from there.

I have tested this in Chrome, IE6+ and Firefox and this approach seems to work in all of them.

Example code:

function DownloadFile(filePath) {
    var downloadIframe = $('<iframe />', 
        {
            id    :    'downloadIframe'        
        }).appendTo('body');
    downloadIframe.attr('src', filePath);
}

This will only work properly for a one off download (as we've hard coded an id), if you are triggering multiple downloads, then I suggest you reuse the iframe by storing it in a more widely accessible variable.

Upvotes: 12

Felix
Felix

Reputation: 4081

Add the download attribute to the a tag, which seems to prevent onbeforeunload from firing:

<a download href="mysite.com"></a>

From this answer.

Upvotes: 10

Jerod Venema
Jerod Venema

Reputation: 44642

I know this answer is really late, but there's a simple solution. Create an iframe dynamically, and set the "src" of it to your download url via JavaScript. This'll kick off the download without triggering the unload event (I think).

Upvotes: 4

Stein G. Strindhaug
Stein G. Strindhaug

Reputation: 5119

I would guess using the target attribute on the link could do the trick.

<a href="http://www.example.com/somefile.zip" target="_blank">download</a>

Will not validate (unless using frameset doctype) but it might work.. It will create a new tab or window and then pop a file download (if the http header says it should), but it might leave the new tabs/windows open, or it might close them after saving...

On the other hand I think having a onbeforeunload handler that you sometimes do not want to trigger sounds suspicious, why do you need that anyway?

Upvotes: 4

Related Questions