Is it possible to dynamicly zip files before downloading from another servers?

I am wondering is it possible to write browser extension or simple Java Script code, which having a list of URLs to different location, could zip everything together.

I mean...

For instance...having 3 different image files on:

Is it possible to download all of them as zipped files archive images.zip by Java Script code on http://mysite.com ?

I have found JSZip, however I don't know how use it to load files from different servers.

Answers


take a look at this code: I have assembled a Demo for you to get started from there. Scroll down to the last lines of the code.

First we need to laod the images into <img> tags. then we will read the content of them. then all can be done via the jszip.

but there are limitations. you can not load images from another domains. so images should be in the same url or you dynamically load them via server side like: http://yourdomain.com/fileLoader.php?url=Url_To_External_Image

here is the code snipee that do the magic:

function getBase64Image(imgage) {
    var canvas = document.createElement("canvas");
    canvas.width = imgage.width;
    canvas.height = imgage.height;

    var ctx = canvas.getContext("2d");
    ctx.drawImage(imgage, 0, 0);

    var dataURL = canvas.toDataURL("image/png");
    return dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
}

var img = $("<img />").attr('src', '../../../img/logo.png');

img.load(function() {
    if (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0) {
        alert('broken image!');
    }
    else {
        var zip = new JSZip();
        content = getBase64Image(img[0]);
        zip.file("24.jpg", content + "\n");
        var content = zip.generate();
        location.href="data:application/zip;base64,"+content;
    }
});

Need Your Help

Repository Methods vs. Extending IQueryable

c# .net extension-methods repository-pattern iqueryable

I have repositories (e.g. ContactRepository, UserRepository and so forth) which encapsulate data access to the domain model.

XMLHttpRequest not loading the page properly

javascript xmlhttprequest

I stumbled upon a strange behaviour of the XMLHttpRequest. Maybe I'm just not well informed enough about its possibilities or possible how Javascript pages load, so could someone please confirm my