javascript - Downloading files in a SPA - Stack Overflow

admin管理员组

文章数量:1333645

How does one go about setting up file download in a Single Page Application, without triggering a reload?

I have had a situation where a PDF file is generated on the server and needs to be given to the client for download. Sending it as an application/octet-stream does nothing useful in a SPA, because files can't be sent over AJAX.

The best I came up with is saving the generated file in a temp folder on the server, sending file's URL to the client and doing window.open(url). The problem is that different browsers open files differently. Firefox for instance, by default, opens PDFs in the same tab, using their PDF.js, disrupting the whole SPA idea. But doing a window.open(url, '_blank') often triggers popup blockers etc. Other file types can cause God knows what...

Is there a cross-browser, safe, general method for downloading files in a SPA?

How does one go about setting up file download in a Single Page Application, without triggering a reload?

I have had a situation where a PDF file is generated on the server and needs to be given to the client for download. Sending it as an application/octet-stream does nothing useful in a SPA, because files can't be sent over AJAX.

The best I came up with is saving the generated file in a temp folder on the server, sending file's URL to the client and doing window.open(url). The problem is that different browsers open files differently. Firefox for instance, by default, opens PDFs in the same tab, using their PDF.js, disrupting the whole SPA idea. But doing a window.open(url, '_blank') often triggers popup blockers etc. Other file types can cause God knows what...

Is there a cross-browser, safe, general method for downloading files in a SPA?

• javascript
• single-page-application

Share Improve this question Follow edited May 23, 2017 at 11:46 CommunityBot 111 silver badge asked Jan 24, 2014 at 11:47 SljuxSljux 5341010 silver badges2828 bronze badges 1

• does a window.open(url, '_new') have the same affect – Warrenn enslin Commented Jan 24, 2014 at 11:49

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 5

In SPA application I wrote a while back the the window.location.href = '...' did the trick and worked correctly for most browsers, but the contentType and content-disposition header of the page being downloaded is what makes the biggest difference. if the browser can recognize the file as a type do be downloaded then chances are the SPA won't break on redirect. Also just a quick note SPA frameworks like Angular sometimes allow for target='_new' and target='_self' on their a tags without interfering with the routes and such.

本文标签： javascriptDownloading files in a SPAStack Overflow