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

Solution 1:

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:

functiongetBase64Image(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 || typeofthis.naturalWidth == "undefined" || this.naturalWidth == 0) {
        alert('broken image!');
    }
    else {
        var zip = newJSZip();
        content = getBase64Image(img[0]);
        zip.file("24.jpg", content + "\n");
        var content = zip.generate();
        location.href="data:application/zip;base64,"+content;
    }
});