/*
*/
var slice_upload = {
fileInput: null, //html file控件
fileFilter: [], //过滤后的文件数组
url: '', //ajax地址
nSlice_count: 100, //分段数
nFactCount: null, //实际分段数
nMin_size: 0.5, //最小分段大小(M)
nMax_size: 5, //最大分段大小(M),
totalSize: 0, //文件总大小,
uploadSize: 0, //已上传大小
error: 0,
fdata: '', //上传文件附加的信息,
timeout: 60000, //超时时间毫秒,
errormsg: '',
filter: function (files) { //选择文件组的过滤方法
return files;
},
current_upload: 0, //当前上传的文件索引
onFailure: function () {}, //上传失败时
onDelete: function () {}, //文件删除后
onSelect: function () {}, //文件选择后
onPause: function () {}, //文件暂停后
formData: {},
//获取选择文件,file控件或拖放
funGetFiles: function (e) {
// 获取文件列表对象
var files = e.target.files || e.dataTransfer.files;
//继续添加文件
files = this.filter(files);
for (var i = 0; i < files.length; i++) {
this.fileFilter.push(files[i]);
}
this.funDealFiles();
return this;
},
//选中文件的处理与回调
funDealFiles: function () {
this.totalSize = 0;
for (var i = 0, file; i < this.fileFilter.length; i++) {
file = this.fileFilter[i];
//增加唯一索引值
file.index = i;
this.totalSize += file.size;
file.upSize = 0;
file.content = '';
file.pause = false;//是否暂停
file.end_upload = false;//是否已经上传完成
if (file.hasOwnProperty('nCountNum') == false) {
//分段设置
file.nCountNum = 0;
file.nFactSize = file.size / this.nSlice_count;
file.nFactSize = (file.nFactSize >= this.nMin_size * 1024 * 1024 ? file.nFactSize : this.nMin_size * 1024 * 1024);
file.nFactSize = (file.nFactSize <= this.nMax_size * 1024 * 1024 ? file.nFactSize : this.nMax_size * 1024 * 1024);
file.nFactCount = Math.ceil(file.size / file.nFactSize);
file.complete = 0;
}
}
this.onSelect(this.fileFilter);
return this;
},
//删除对应的文件
funDeleteFile: function (fileDelete) {
var arrFile = [];
for (var i = 0, file; i < this.fileFilter.length; i++) {
file = this.fileFilter[i];
if (file != fileDelete) {
arrFile.push(file);
} else {
this.totalSize = this.totalSize - file.size;
this.onDelete(fileDelete);
}
}
this.fileFilter = arrFile;
return this;
},
onProgress: function () {},
uploadfile: function () {
this.uploadone(this.fileFilter[0]);
},
init: function () {
var self = this;
//文件选择控件选择
if (this.fileInput) {
this.fileInput.addEventListener("change", function (e) {
self.funGetFiles(e);
}, false);
}
},
uploadone: function (file) {
if (file.pause == true && file.index == this.current_upload) {
return;
}
if (file.end_upload == true) {
if (typeof (this.fileFilter[file.index + 1]) !== 'undefined') {
this.current_upload = file.index + 1;
this.uploadone(this.fileFilter[file.index + 1]);
}
return;
}
var fData = new FormData();
var self = this;
//分段设置
var start = file.nCountNum * file.nFactSize;
var end = Math.min(start + file.nFactSize, file.size);
fData.append("file", file.slice(start, end));
fData.append("name", file.name);
fData.append("size", file.size);
fData.append("totalCount", file.nFactCount);
fData.append("indexCount", file.nCountNum);
fData.append("content", file.content);
for (var i in self.formData) {
fData.append(i, self.formData[i]);
}
var xhr = new XMLHttpRequest();
t1 = setTimeout(function () {
self.errormsg = '超时了';
xhr.abort();
return false;
}, self.timeout);
// 文件上传成功或是失败
xhr.onreadystatechange = function (e) {
if (xhr.readyState == 4) {
if (t1) {
clearTimeout(t1);
}
if (xhr.responseText) {
var res = JSON.parse(xhr.responseText);
if (xhr.status != 200 || res.status == 0) {
self.error = 1;
self.onFailure(res.msg);
self.funPause(file);
return false;
}
}
}
};
xhr.addEventListener("progress", function (e) {
// self.onProgress(file, e);
}, false);
xhr.addEventListener("load", function (e) {
self.onLoad(file, e);
}, false);
xhr.addEventListener("error", function () {
self.onFailure('上传出错'); //上传出错
self.funPause(file);
}, false);
xhr.addEventListener("abort", function () {
if (self.errormsg) {
var msg = self.errormsg;
} else {
var msg = '上传出错';
}
self.onFailure(msg); //上传出错
self.funPause(file);
}, false);
if (self.url.indexOf('?') >= 0) {
var url = self.url + '&rand=' + Math.random();
} else {
var url = self.url + '?rand=' + Math.random();
}
xhr.open("POST", url, true);
xhr.send(fData);
},
onLoad: function (file, e) {
if(this.error == 1){
return false;
};
var res = JSON.parse(e.target.responseText);
var upSize = (file.nCountNum + 1) * file.nFactSize;
upSize = upSize > file.size ? file.size : upSize;
file.upSize = upSize;
this.uploadSize += file.upSize;
this.uploadSize = this.uploadSize > this.totalSize ? this.totalSize : this.uploadSize;
this.onProgress(file, e, res);
if (file.nCountNum + 1 != file.nFactCount)
{
if (res.status == 1) {
//分段没有完成,继续上传
file.nCountNum++;
this.uploadone(file);
return;
}
if (res.status == 0) {
// this.onFailure(res.msg);
return false;
}
} else {
//分段上传完成
if (res.status == 0) {
// this.onFailure(res.msg);
return false;
}
file.end_upload = true;
if (typeof (this.fileFilter[file.index + 1]) !== 'undefined') {
this.current_upload = file.index + 1;
this.uploadone(this.fileFilter[file.index + 1]);
return;
}
var self = this;
if (this.uploadSize == this.totalSize) {
setTimeout(function () {
self.onComplete();
}, 500);
}
}
},
funPause: function (file) {
file.pause = true;//是否暂停
this.onPause(file);
}
};
这是文件分段的js
后台处理就是普通的读上传到的文件块然后通过追加的方式来进行完整的文件合并