vue前端解压zip包,判断压缩包内容
1.下载jszipnpm i jszip -Sornpm install jszip2.引入jszipimport JsZip from 'jszip';3.<el-uploadref="elUpload"class="upload-demo"action="customiz...
·
1.下载jszip
npm i jszip -S or npm install jszip
2.引入jszip
import JsZip from 'jszip';
3.
<el-upload
ref="elUpload"
class="upload-demo"
action="customize"
:http-request="uploadSectionFile"
multiple
:limit="1"
accept=".zip"
:file-list="fileList"
:auto-upload="false"
:on-change="onchange"
:on-exceed="handleExceed">
<el-button class="uplodeBtton" ref="uplodeBtton" size="small" type="primary" @click="changeFile()" ></el-button>
<div slot="tip" class="el-upload__tip">上传要求:仅支持zip压缩包,小于30MB;</div>
<div slot="tip" class="el-upload__tip">模型格式:仅支持obj格式,贴图为jpg、png</div>
<div slot="tip" class="el-upload__tip">文件目录:压缩包中obj文件不能被包含在文件夹中</div>
</el-upload>
4.
onchange(file){
console.log(file)
this.modelForm.name = file.name;
var idx = file.name.lastIndexOf(".");
var type = file.name.substr(idx+1);
var _this = this
var _obj = Object
//------是否是zip包---------//
if(type==='zip'){
const isLt2M = file.size / 1024 / 1024 < 30;
if(!isLt2M) {
//文件大小超过30M,报错
this.$message({
message: '上传文件大小不能超过 30MB!',
type: 'warning'
});
}else{
var new_zip = new JsZip();
// console.log(new_zip.loadAsync(file.raw))
new_zip.loadAsync(file.raw)
.then(function(file) {
//----file压缩包里的内容----//
var _array = _obj.values(file.files);
//是否存在obj文件
var hasObjFile=false;
//obj文件被包在文件夹中
var hasdir=false;
for(var i = 0;i<=_array.length-1;i++){
var name = _array[i].name;
var index = name.lastIndexOf(".");
var ext = name.substr(index+1);
if(ext==='obj'){
hasObjFile=true;
// 文件路径出现两个及以上'/',则obj文件在3级目录中,外面有文件夹包裹
var num = name.split("/").length;
if(num>2){
//如果obj文件外层有包含dir,则抛出错误!
hasdir=true;
$(".uplodeBtton").addClass('distroy');
$(".uplodeBtton").removeClass("change");
_this.$refs.elUpload.abort();
_this.$refs.elUpload.clearFiles();
_this.$message.error("obj文件不在一级目录!")
break;
}else{
break;
}
}
}
if(!hasObjFile){
//不包含obj文件
$(".uplodeBtton").addClass('distroy');
$(".uplodeBtton").removeClass("change");
_this.$refs.elUpload.abort();
_this.$refs.elUpload.clearFiles();
_this.$message.error("压缩包不包含obj文件!")
}else{
if(!hasdir){
_this.able=true
$(".uplodeBtton").addClass('change')
$(".uplodeBtton").removeClass('distroy')
}
}
}).catch(err=>{
//是否是合法的zip包,解决rar包改后缀zip
_this.$message.error("请上传正确格式的文件")
});
}
}else{
_this.$refs.elUpload.abort();
_this.$refs.elUpload.clearFiles();
_this.$message.error("不是zip文件!")
}
}
更多推荐
已为社区贡献1条内容
所有评论(0)