dropzone.js重寫斷點續傳功能
js文件：
var uploaddropzone = new Dropzone("#uploaddropzone",{
url: ctx + "/slider/fileUploadContinue",
acceptedFiles: "",
maxFiles: 1,
autoDiscover : false,
addRemoveLinks: true,
dictRemoveFile: ‘x‘,
dictDefaultMessage: ‘Drop file here or click to upload‘,
dictInvalidFileType: "你不能上傳該類型文件,文件類型只能是",
thumbnailHeight:100,
thumbnailWidth:256,
customUpload: function(files,xhr){ // 重寫了 dropzone.js 源碼， 主要功能是在dropzone發送文件請求的時候進行攔截，以另一種方式進行.
var file=files[0];
fileUploadCheckAjax(file,xhr);//file 需要上傳的文件，xhr 監聽事件
},
init:function(){
this.on("addedfile", function(file) {
$("#uploadChoose").attr("disabled",true);
});
this.on("success", function(file) {
$("#fileResource").html(file.xhr.responseText);
$("#uploadChoose").attr("disabled",false);
});
this.on("complete", function(data) {
if(data.status == "error"){
promptPop("warning","上傳失敗");
}
});
}
function fileUploadCheckAjax(file,xhr){
xhr.onreadystatechange = function() {//上傳狀態監聽 xhr.responseText 返回值，由 後臺提供
console.log(xhr.readyState + "-" + xhr.status + "-" + xhr.responseText);
if (xhr.readyState == 4 && xhr.status == 200) {
if(xhr.responseText=="error"){
alert(‘失敗‘);
}else{
alert(‘成功‘);
}
}
};
var load=0;//上傳進度百分比
var param = "fileName=" + file.name + "&fileSize=" + file.size + "&fileType="
+ file.type + "&fileLastModified=" + file.lastModified; //文件信息
var xhrCheck = new XMLHttpRequest();//檢查請求 第二個監聽 主要監聽文件的上傳情況
xhrCheck.onreadystatechange = function() {//檢查狀態監聽，成功後執行發送上傳請求
if (xhrCheck.status == 200 && xhrCheck.readyState == 4) {
load = parseInt(xhrCheck.responseText);
xhr.open("POST", ctx+"/slider/fileUploadContinue?" + param, true);//上傳文件方法實現
xhr.send(file.slice(load, file.size, file.type));//通過File.slice方法獲得未上傳過的數據信息,再上傳（重點）
xhr.upload.uploadprogress = function(e) {//上傳進度監聽
this.emit("uploadprogress", file, 100, file.upload.bytesSent)
};
}
};
xhrCheck.open("POST", ctx+"/slider/fileUploadCheck?" + param, true);// 監聽請求地址，該方法主要返回已上傳文件的大小
xhrCheck.send();//發送檢查請求
}
dropzone.js 修改：
Dropzone.prototype.uploadFiles 方法，
在 return xhr.send(formData); 之前加如下代碼：
if(this.options.customUpload!=null) {
return this.options.customUpload(files,xhr);
}//如果定義了customUpload方法，則返回customUpload方法，否則按照原方法實現。這也就是為何要在js裏面增加customUpload 的原因。
java：
fileUploadCheck方法：以上傳文件的名字，類型，大小和最後修改時間來判定是否為同一個文件，在指定的臨時存儲的路徑檢索該文件並且返回該文件已上傳的大小。
@ResponseBody
@RequestMapping(value="/fileUploadCheck",method = RequestMethod.POST)
public Long fileUploadCheck(FileVo fileVo) throws Exception {
String sysPath=this.getFileUpLoadPath("upload.file.tmp");
// 通過name、size、type、lastModified四個屬性來確定文件唯一性——MD5散列值。
String fileID = EncoderByMd5(fileVo.getFileName()+fileVo.getFileSize()+ fileVo.getFileType() + fileVo.getFileLastModified());
String fileName = DateUtils.getCurrentDate("yyyyMMDD")+fileID +fileVo.getFileName().substring(fileVo.getFileName().lastIndexOf("."));
File dir = new File(sysPath);
//判斷文件夾是否存在 不存在則創建
if (!dir.exists()) {
dir.mkdir();
}
File file =new File(sysPath+File.separator + fileName);
if (!file.exists()) {
return 0l;
} else {
return file.length();
}
}
EncoderByMd5方法： 對指定字符串進行MD5編碼
public String EncoderByMd5(String str){
try {
// 生成一個MD5加密計算摘要
MessageDigest md = MessageDigest.getInstance("MD5");
// 計算md5函數
md.update(str.getBytes());
// digest()最後確定返回md5 hash值，返回值為8為字符串。因為md5 hash值是16位的hex值，實際上就是8位的字符
// BigInteger函數則將8位的字符串轉換成16位hex值，用字符串來表示；得到字符串形式的hash值
return new BigInteger(1, md.digest()).toString(16);
} catch (Exception e) {
e.printStackTrace();
return str;
}
}
fileUploadContinue：方法 以復寫的形式上傳文件到臨時路徑，
@ResponseBody
@RequestMapping(value="/fileUploadContinue",method = RequestMethod.POST)
public String fileUploadContinue(ModelMap map,HttpServletRequest request,FileVo fileVo) throws Exception {
ServletInputStream is = request.getInputStream();//輸入流，由前端提供，
String sysPath=this.getFileUpLoadPath("upload.file.tmp");//系統配置的文件臨時存儲路徑
// 通過name、size、type、lastModified四個屬性來確定文件唯一性——MD5散列值。
String fileID = EncoderByMd5(fileVo.getFileName()+fileVo.getFileSize()+ fileVo.getFileType() + fileVo.getFileLastModified());
String fileName = DateUtils.getCurrentDate("yyyyMMDD")+ fileID +fileVo.getFileName().substring(fileVo.getFileName().lastIndexOf("."));
FileOutputStream os = null;
File file = null;
try {
BufferedInputStream bis = new BufferedInputStream(is);
byte[] b = new byte[1024 * 1024];
file =new File(sysPath+File.separator + fileName);
if (!file.exists()) {
file.createNewFile();
}
os = new FileOutputStream(file, true);// append
int n = 0;
while ((n = bis.read(b)) > 0) {
os.write(b, 0, n);
}
} catch (IOException e) {
e.printStackTrace();
} finally {
try {
os.close();
is.close();
} catch (IOException e) {
e.printStackTrace();
}
}
InputStream newIs=new FileInputStream(new File(sysPath+File.separator + fileName)); // newIs 新的文件流
}
dropzone.js重寫斷點續傳功能