简单的JSZip -从现有的图像创建Zip文件

Simple JSZip - Create Zip File From Existing Images

本文关键字:图像 创建 文件 Zip JSZip 简单      更新时间:2023-09-26

我很难找到不涉及Base64或NodeJS的JSZip简单文档。基本上,我有一个目录,其中是test.html和一个名为"images"的文件夹。文件夹里有一堆图像。我想把那个文件夹做成一个zip文件。

有人能帮我一些非常简单的"你好世界"类型的代码吗?http://stuk.github.io/jszip/上的文档包括从Base64数据中添加图像或添加用JavaScript创建的文本文件等内容。我想从现有的文件创建一个。zip文件。

也许唯一支持用JSZip将图像添加到.zip文件的方法是通过Base64数据添加它们?我在文档中没有看到任何地方,也没有看到image-url-to-base64函数,尽管我确实在StackOverflow的其他地方找到了一个。

任何建议吗?

在浏览器中,您可以使用ajax请求并使用responseType属性来获得arraybuffer(如果您需要ie9支持,您可以使用jszip-utils为例):

var xhr = new XMLHttpRequest();
xhr.open('GET', "images/img1.png", true);
xhr.responseType = "arraybuffer";
xhr.onreadystatechange = function(evt) {
    if (xhr.readyState === 4) {
        if (xhr.status === 200) {
            var zip = new JSZip();
            zip.file("images/img1.png", xhr.response);
        }
    }
};
xhr.send();

这个示例有限的,因为它只处理一个文件并手动创建xhr对象(我没有使用任何库,因为您没有提到任何库),但应该向您展示如何做到这一点。

你可以在JSZip文档中找到一个更完整的例子:它使用jQuery promises和jsip -utils来下载一个文件列表,然后触发下载。

如果您使用库来处理ajax请求,请务必检查是否可以请求arraybuffer。默认是将响应视为文本,这将破坏您的图像。例如,jQuery很快就会支持它。