3

別の場所への URL のリストを持ち、すべてをまとめて圧縮できるブラウザー拡張機能または単純な Java Script コードを作成できるかどうか疑問に思っています。

つまり...

たとえば... 3 つの異なる画像ファイルがある場合:

http://mysite.comで Java Script コードを使用して、zip ファイル アーカイブ images.zip としてそれらすべてをダウンロードすることはできますか?

JSZipを見つけましたが、それを使用して別のサーバーからファイルをロードする方法がわかりません。

4

1 に答える 1

5

このコードを見てください:そこから始めるためのデモを作成しました。コードの最後の行までスクロールします。

まず、画像を<img>タグにロードする必要があります。次に、それらの内容を読み取ります。その後、すべて jszip を介して実行できます。

しかし、制限があります。別のドメインから画像を読み込むことはできません。したがって、画像は同じ URL にある必要があります。または、次のようにサーバー側から動的にロードする必要があります。 http://yourdomain.com/fileLoader.php?url=Url_To_External_Image

これが魔法のコード スナイピーです。

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;
    }
});
于 2012-06-26T18:30:13.657 に答える