在线html解压,javascript实现网页端解压并查看zip文件

WEB前端解压ZIP压缩包

web前端解压zip文件有什么用：

只考虑标准浏览器的话， 服务器只要传输压缩包到客户端， 节约了带宽， 而且节约了传输时间， 听起来好像很厉害的说；

如果前端的代码很多， 而且包含大副的图片，那么就可以把js和css和jpg和png等各种数据通过服务端打包成zip传送到浏览器， 浏览器负责解压， css实用动态生成插入到dom中，js也用globalEval直接执行， jpg或者png各种图片文件由blob流转化为image， 直接插入到浏览器中；

html5支持读取Blob(二进制大对象, file文件也是继承了Blob)， 并转化为图片流或者文字流或者其他流格式， 这也是为什么浏览器可以读取"application/zip"文件的原因；

要在浏览器中解压zip文件的话需要引入四个js ， 因为UnZipArchive.js依赖了zip.js, mime-type.js和jquery.js , 测试demo如下：

demo

$("#file").change(function (e) {

var file = this.files[0];

window.un = new UnZipArchive( file );

un.getData( function() {

//获取所以的文件和文件夹列表;

var arr = un.getEntries();

//拼接字符串

var str = "";

for(var i=0; i

//点击li的话直接下载文件;

str += "

"+arr[i]+""

};

$("#dir").html( str );

});

});

var download = function ( filename ) {

un.download( filename );

};

UnzioarichiveJS 是自己封装的， 有任何问题