Could not download zip file in IE

[Geekays]

I followed the sample on your site and wrote code for zipping and downloading selected files from a site. The zip is created, but not downloaded on IE.

I tried to use the sample in your site and it does not work in IE. I tried using blob_url as well, but failed.

Is there some working example?

[Stuk]

Someone had this issue yesterday and posted the code that worked for them here: #92 (comment) Does that work for you? oops, sorry, that's for unzipping

[Stuk]

Is this the sample that you tried that didn't work?

[alamont]

You can use msSaveBlob in IE10+

blob = zip.generate({type:"blob"});
window.navigator.msSaveBlob(blob, "test.zip");

[Geekays]

Right @Stuk , the sample you are pointing to is not working on IE.

@alamont: I shall try that and update here.

[Geekays]

@alamont I get error on the line

var blob = zip.generate({type:"blob"});

as

{exception} blob is not supported by this browser

in jszip.min.js

I am using IE11.

[alamont]

That's strange. Blobs should be supported by IE10+.
I just pasted the following code in the console at this sample (it uses the unminimized jszip.js) in IE11 and it seem to work.

var zip = new JSZip();
zip.file("Hello.txt", "Hello World\n");
blob = zip.generate({type:"blob"});
window.navigator.msSaveBlob(blob, "test.zip");

[dduponchel]

The code snippet of @alamont works for me in IE 11 (minified or not minified JSZip loaded).
@Geekays that's strange. In your IE 11, what's the value of JSZip.support.blob ? I have true unless I force IE 11 to behave like IE 9.

[dduponchel]

We could add FileSaver.js to the list of polyfill (and update the example) :

saveAs(zip.generate({type:"blob"}), "hello world.zip");

[dduponchel]

I've updated the example on a branch and tested it successfully on IE 10 and 11.
Blob urls are supported by Firefox and Chrome (can't get the example to work on IE) and the FileSaver API is supported by IE 10/11 and Chrome. In this situation, you can use feature detection to select the right API or use the FileSaver.js polyfill.
@Geekays can you check that my example works for you ? If so, I will create a pull request.

[Geekays]

I need to look at it from a different angle. The page is running on Compatibility View. I get

JSZip.support.blob  false

And if I remove the Compatibility View, the functionality does not work as I use Ajax to get the content of the files and the Ajax calls fails when the Compatibility View as the sites are SharePoint sites with NTLM authentication.

Let me give the scenario:
The page has a list of check boxes to select a list of files. I am adding a button "Zip and Download" to make the files available as a zip file.

Here is the code:

            //added for multiple file download
            function zipdownload() {
                var fileURLs = new Array();
                $("input:checkbox:checked").each(function () {
                    fileURLs.push($(this).val()); 
                });
                var zip = new JSZip();
                var count = 0;
                for (var i = 0; i < fileURLs.length; i++){
                    var xhr = new XMLHttpRequest();
                    xhr.open('GET', fileURLs[i], true);
                    xhr.withCredentials=true;
                    xhr.responseType = "blob";
                    xhr.onreadystatechange = function () {
                        if ((xhr.readyState == 0) || (xhr.readyState == 4)) {
                            if (count < fileURLs.length){
                                var bdata = xhr.responseText;
                                // add downloaded file to zip:
                                var fileName = fileURLs[count].substring(fileURLs[count].lastIndexOf('/')+1);
                                zip.file(fileName, bdata); // <- here's one problem
                                count++;
                            }
                            if (count == fileURLs.length){
                                count++;
                                // all download are completed, create the zip
                                //var blob = zip.generate({type:"blob"});
                                //window.navigator.msSaveBlob();
                                //window.navigator.msSaveBlob(blob, "test.zip");
                                // Blob
                                $("#link").html("<a href='#' id='blob'>click to download</a>");
                                var blobLink = document.getElementById('blob');
                                var saveAs = window.saveAs || (navigator.msSaveBlob && navigator.msSaveBlob.bind(navigator))
                                var blobDownloadSupported = JSZip.support.blob && (saveAs || window.URL && window.URL.createObjectURL);
                                if (blobDownloadSupported) {
                                blobLink.onclick = function () {
                                  try {
                                    var blob = zip.generate({type:"blob"});
                                    if (saveAs) {
                                      saveAs(blob, "hello.zip");
                                    } else {
                                      blobLink.download = "hello.zip";
                                      blobLink.href = window.URL.createObjectURL(blob);
                                    }
                                  } catch(e) {
                                    blobLink.innerHTML += " " + e;
                                  }
                                  return false;
                                };
                                } else {
                                blobLink.innerHTML += " (not supported on this browser)";
                                }
                            }
                        }
                    };
                    xhr.send();
                }
            }

[dduponchel]

Ok, I think I see what you're trying to do. I'm not an expert of the Compatibility View of IE10 so I will assume that it behaves as IE8/9.

To download the files

IE <= 9 is not a nice place when it comes to ajax calls and binary content. The default behavior is to treat everything as text and this breaks any binary content.
For the unit tests, we inject vbscript (thanks stackoverflow). Our tests use the file browser-test-utils.js to create the XHR and extract the content and browser-ie-test-utils.js to inject some vbscript and use it.
I'm sure this works (our unit tests pass in IE 6-9) but I also suspect that the vbscript won't be fast.

To give the zip file to the user

On IE <= 9, I don't know any pure js method to do that without any server call (if you ever find one I'll be greatly interested !). You can do that with a flash component like Downloadify... or any other similiar tool (Downloady hasn't been updated in the last 4 years).

I don't know your development constraints but doing that server side may be easier !

[dduponchel]

The documentation has been updated and now contains guides for these issues.

[dhruvin16]

Using this code we are able to download a zip file in IE .
But when we download and open only text file open perfectly,word,pdf,jpg,png file not opened.