Javascript/Html5 Download zip from url

Question

Is possibile to donwload a zip from url by javascript or html5 (client side)?

I'm trying to use ajax :

$.ajax({
                    type: 'GET',
                    //dataType: "json",
                    //crossDomain: true,
                    crossOrigin: true,
                    //url : "https://pdftron.s3.amazonaws.com/files/xod/NY_fun_list." + docType,
                    url: 'http://www.pdftron.com/webviewer/demo/doc/WebViewer_Developer_Guide.pdf',
                    headers:{'Access-Control-Allow-Origin': '*'},
                    success: function (responseData, textStatus, jqXHR) {
                        console.log('in');
                        //data = JSON.parse(responseData['AuthenticateUserResult']);
                        console.log(data);
                    },
                    error: function (responseData, textStatus, errorThrown) {
                        alert('Get non riuscita');
                    }
              });

I have always the same problem about CROSS Origin and I don't know if this is the right way to do it. Any advice?

Thanks.

`headers:{'Access-Control-Allow-Origin': '*'},` — Access-Control-Allow-Origin is a **response** header. You can't give yourself permission to read data from someone else's server. The server has to give you permission. — Quentin, Apr 20 '16 at 08:25
Your question says "Download zip from url", but your URL says "WebViewer_Developer_Guide.pdf" but your JS has at said 'dataType: "json"' and `JSON.parse(responseData` … what are you actually trying to do?! — Quentin, Apr 20 '16 at 08:26
this url is an example, I can't post real url for security problem. Data type is commented. I ha ve to download a zip and unzip it. — KPN24, Apr 20 '16 at 08:29
So, looking at the comments here and on the answers: Final goal is to use JS to fetch a zip file and then do stuff with it in JS (download *not* being used here in the colloquial sense of "save to hard disk") and the current problem is the standard same origin policy issue, which makes this a duplicate. — Quentin, Apr 20 '16 at 08:35
Yes, I have to download zip, unzip it, and store files into indexedDB. — KPN24, Apr 20 '16 at 08:37
Quentin, first: why my post i a duplicate?? Second: how can delete this post? — KPN24, Apr 20 '16 at 13:42
Because the problem you have encountered is the standard same origin policy error. — Quentin, Apr 20 '16 at 13:42

score 1 · Answer 1 · answered Apr 20 '16 at 08:13

1

This will download that .pdf in your browser:

<a href="http://www.pdftron.com/webviewer/demo/doc/WebViewer_Developer_Guide.pdf" download="my_file.pdf>DOWNLOAD PDF</a>

answered Apr 20 '16 at 08:13

Faisal Ashfaq

2,545
4
28
41

Thanks, is there a way to download a zip and unzip it in background? I have to store files (after unzip) inside indexedDB. – KPN24 Apr 20 '16 at 08:31

score 0 · Answer 2 · answered Apr 20 '16 at 08:21

Downloading a file automatically to a user's computer via Javascript seems undesirable. Additionally, you will run into a whole slew of problems when attempting to load arbitrary URLs from Javascript, because CORS is meant to prevent scripts from accessing domains they don't control.

If you are always loading from a domain you control then you need to configure CORS on your server/backend application: https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

However, in my opinion, if you want to download a file to a user's computer, you should always download that file on their terms by giving them an HTML5 download link to click themselves.

HTML5 has a download attribute that will tell the browser to always download the file, and it will not be affected by CORS. The value of the download attribute is the name of the file as it should be saved on their computer.

<a href="http://www.pdftron.com/webviewer/demo/doc/WebViewer_Developer_Guide.pdf" download="WebViewer_Developer_Guide.pdf">Download Now</a>

Javascript/Html5 Download zip from url

2 Answers2