initUpload();//初始化上传functioninitUpload(){
var chunk = 100 * 1024; //每片大小 var input = document.getElementById("file"); //input file input.onchange = function(e){
var file = this.files[0];
var query = {};
var chunks = [];
if (!!file) {
var start = 0;
//文件分片 for (var i = 0; i < Math.ceil(file.size / chunk); i++) {
var end = start + chunk;
chunks[i] = file.slice(start , end);
start = end;
}
// 采用post方法上传文件 // url query上拼接以下参数，用于记录上传偏移 // post body中存放本次要上传的二进制数据 query = {
fileSize: file.size,
dataSize: chunk,
nextOffset: 0 }
upload(chunks, query, successPerUpload);
}
}
}// 执行上传functionupload(chunks, query, cb){
var queryStr = Object.getOwnPropertyNames(query).map(key=> {
return key + "=" + query[key];
}).join("&");
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://xxxx/opload?" + queryStr);
xhr.overrideMimeType("application/octet-stream");
//获取post body中二进制数据 var index = Math.floor(query.nextOffset / query.dataSize);
getFileBinary(chunks[index], function(binary){
if (xhr.sendAsBinary) {
xhr.sendAsBinary(binary);
} else {
xhr.send(binary);
}
});
xhr.onreadystatechange = function(e){
if (xhr.readyState === 4) {
if (xhr.status === 200) {
var resp = JSON.parse(xhr.responseText);
// 接口返回nextoffset // resp = { // isFinish:false, // offset:100*1024 // } if (typeof cb === "function") {
cb.call(this, resp, chunks, query)
}
}
}
}
}// 每片上传成功后执行functionsuccessPerUpload(resp, chunks, query){
if (resp.isFinish === true) {
alert("上传成功");
} else {
//未上传完毕 query.offset = resp.offset;
upload(chunks, query, successPerUpload);
}
}// 获取文件二进制数据functiongetFileBinary(file, cb){
var reader = new FileReader();
reader.readAsArrayBuffer(file);
reader.onload = function(e){
if (typeof cb === "function") {
cb.call(this, this.result);
}
}
}
console