天天看点

jszip 解压压缩包_JavaScript 实现的 zip 压缩和解压缩工具包Zip.js使用详解

zip.js是什么

通过zip.js封装一个能在网页端生成zip文件的插件, 直接在网页中创建包含文件夹和文件的压缩包,也可以自定义名字并下载;

如何使用:

1:引用zip.js

2:引用jQuery;

3:并引用封装的ZipArchive.js ,(因为zip.js的api使用起来比较繁琐,所以自己封装实现了这个插件)

4:引用mime-types.js;

查看DEMO, 使用方式为:

运行下面代码

var z = new ZipArchive;

z.addFile("a/a.txt", "aaaaaaacontent");

z.addFile("aaaa.txt", "aaaaaaaccccc");

z.export("nono");

DEMO在后面:文件下载下来, 文件夹的格式如下:

jszip 解压压缩包_JavaScript 实现的 zip 压缩和解压缩工具包Zip.js使用详解
jszip 解压压缩包_JavaScript 实现的 zip 压缩和解压缩工具包Zip.js使用详解

回到顶部

创建压缩文件和文件夹的详细源代码:

运行下面代码

code{

display: block;

padding: 10px;

background: #eee;

}

兼容性

zip.js可以在所有的chrome浏览器和firefox浏览器中运行, 可以在safari6和IE10,以及IE10以上运行;

如果要在IE9和safari中运行需要两个设置:

1:zip.useWebWorkers == false

2:并引用这个JS:https://bitbucket.org/lindenlab/llsd/raw/7d2646cd3f9b/js/typedarray.js

zip.workerScriptsPath = "http://gildas-lormeau.github.io/zip.js/demos/";

var ZipArchive = function() {

function noop() {};

this.name = "未命名文件";

this.zippedBlob = {};

var _this = this;

this.length = 0;

this.onend = noop;

this.onerror = noop;

this.onprogress = noop;

//创建一个延迟对象;

var def = this.defer = new $.Deferred();

zip.createWriter( new zip.BlobWriter("application/zip"), function(zipWriter) {

_this.zipWriter = zipWriter;

//继续执行队列;

def.resolve();

}, this.error );

};

ZipArchive.blob = function (filename, content) {

return new Blob([ content ], {

type : zip.getMimeType(filename)

});

};

$.extend( ZipArchive.prototype, {

"addFile" : function ( filename , content, options) {

var _this = this;

blob = ZipArchive.blob(filename, content);

//为了产生链式的效果, 必须把deferrer赋值给新的defer

this.defer = this.defer.then(function() {

var def = $.Deferred();

_this.zipWriter.add(filename, new zip.BlobReader(blob)

,function() { // reader

console.log("addFile success!!");

def.resolve();

//zipWriter.close(callback);

}, function (size, total) { //onend

_this.onend(filename, blob, total);

_this.length += total;

}, function () { //onprogress

_this.onprogress(filename, blob, total);

},options || {

//options

});

return def;

});

},

"_addFolder" : function (foldername , options) {

//创建文件夹功能目前不能用;

//创建文件夹功能不好用, 直接通过 zipWriter.addFile("directory/filename.txt", blob())创建文件夹和文件

return this;

},

"size" : function () {

return this.length;

},

"get" : function () {

return this.zippedBlob;

},

"export" : function ( name ) {

name = name || this.name;

var _this = this;

this.defer.then(function() {

_this.zipWriter.close(function( zippedBlob ) {

if( typeof name === "string" || typeof name === "number") {

var downloadButton = document.createElement("a"),

URL = window.webkitURL || window.mozURL || window.URL;

downloadButton.href = URL.createObjectURL( zippedBlob );

downloadButton.download = name + ".zip";

downloadButton.click();

}else{

name( zippedBlob );

};

});

});

},

"error" : function() {

this.onerror( this );

throw new Error("压缩文件创建失败");

}

});

var z = new ZipArchive;

z.addFile("a/a.txt", "aaaaaaacontent");

z.addFile("aaaa.txt", "aaaaaaaccccc");

z.export("nono");