Using javascript to request and download files

Improve this answer. Andrea Andrea 1, 1 1 gold badge 19 19 silver badges 48 48 bronze badges. Alternatively, you could extend its Ext. Within the ExtJS request the params that are being sent to the xhr's send method are being nulled out, as you can see above.

You just gotta fix that :- — Andrea. Sign up or log in Sign up using Google. Sign up using Facebook. Sign up using Email and Password. Post as a guest Name. Email Required, but never shown. The Overflow Blog. Who owns this outage? Building intelligent escalation chains for modern SRE. Podcast Who is building clouds for the independent developer? Featured on Meta. Now live: A fully responsive profile. Reducing the weight of our footer.

Linked The declared function sets a download attribute where you get to name the file. The encodeURIComponent function then encodes the content. The click method prompts the download process to start as you click the download button. There is another option for downloading files without contacting the server.

This time, we are using a JavaScript library called FileSaver. The example below presents the syntax to implement the saveAs FileSaver interface:. It sets the file to a Blob value. For instance, it is useful for preventing sensitive information from being sent to external servers. It includes but is not limited to multimedia objects , programs , and code snippets.

Remember: as Blob has size limitations based on the supported browser, FileSaver. See the table below to check the compatibility of FileSaver. Learn easily by using our HTML5 canvas examples. Learn Bootstrap: this Bootstrap 4 tutorial will easily teach you how to use it for your mobile web design.

Learn Bootstrap quickly to become a master. Code has been added to clipboard! Reading time 3 min. Active 4 months ago. Viewed k times. If I want to download a file, what should I do in the then block below? Improve this question. Mariusz Pawelski Arjun how do you add the token to the header of your request? See Zibri's answer which, btw, was posted way after my comment. In this situation how do you add the token to the header? Add a comment. Active Oldest Votes.

Improve this answer. Mariusz Pawelski Mariusz Pawelski David I updated the answer. Should now also work in FF. This is not mandatory in Chrome or Safari. It makes sense to call URL. AndrewSimontsev Great tip, thanks for the input!

I edited the response, let me know if it is correct that way. Tested on my code and seems ok! I disagree that using a library is a better answer :. Using external libraries is not always an option, and when it is, then finding libraries is easy.

It's not answer worthy, which is likely why your answer has more votes than the accepted answer despite the accepted being 2 years older. So the library doesn't necessarily do it a better way. Lucas Matos Lucas Matos 1, 12 12 silver badges 16 16 bronze badges.

Yes, you can add Content-Disposition to the Headers obj, here is the documentation developer. Do you know how to pass the name to blob with your solution? This gist. LucasMatos I tried editing your answer but the queue is full. Show 5 more comments. Nice, just one thing: would it be possible to get the file name from the server response so to let the user download it with its real name? Phate to do so, you should pass an object from server, which contains not only the data but also the name.

Once you do that, you can deal with its field separately, but for that you should see other answers here as as far as I understand. Zibri Zibri 7, 2 2 gold badges 43 43 silver badges 39 39 bronze badges. Using dowloadjs. This will parse the filename from the header.