//JQuery 文件上传插件 plupload 使用总结
//html页面代码部分,只需要引入相关的plupload包及设置一个div编写一小段js代码
<div id="uploader" class="modal hide" role="dialog"
aria-labelledby="uploaderLabel"></div>
<a id="uploaderBtn" class="btn" href="#uploader" data-toggle="modal">文件上传</a>
<script type="text/javascript" src="${ctx}/static/plupload-2.0.0/js/plupload.full.min.js"></script>
<script type="text/javascript" src="${ctx}/static/plupload-2.0.0/js/jquery.plupload.queue/jquery.plupload.queue.min.js"></script>
<script type="text/javascript" src="${ctx}/static/plupload-2.0.0/js/i18n/zh_CN.js"></script>
<script type="text/javascript">
//plupload 上传文件插件,使用jquery编写。
//插件官网地址:http://plupload.com/
//plupload.full.min.js对应的开发版本为plupload-2.0.0/js/plupload.dev.js
//plupload error方法定义在plupload.dev.js中,
//控件调用时的错误提示判断代码在plupload-2.0.0/js/jquery.ui.plupload/jquery.ui.plupload.js中
$(function() {
$("#uploader").bind('show',function(){
$('#uploader').pluploadQueue({
url : '${ctx}/upload/file',
multipart_params:{dataType:'install'},
max_file_size : '10mb',
filters : [
{title : "Excel files", extensions : "xls,xlsx"}
],
rename: false,
multiple_queues:true,
prevent_duplicates:true,
flash_swf_url : '${ctx}/static/plupload-2.0.0/js/Moxie.swf',
silverlight_xap_url : '${ctx}/static/plupload-2.0.0/js/Moxie.xap',
init:{
Error: function(up, err) {
//当服务器端返回错误信息时error方法显示错误提示,
//服务器端返回错误信息会被plupload转换为-200 http错误,
//所以只能做==-200比较。更好的提示,需要修改插件源代码。
if(err.code==-200){
alert("文件格式错误,请检查后重新上传!");
}
if(err.code==-602){
alert("文件已存在!");
}
},
}
});
});
});
//plupload转换服务端错返回的错误代码方法如下,代码在plupload.dev.js中
function handleError() {
if (retries-- > 0) {
delay(uploadNextChunk, 1);
} else {
file.loaded = offset; // reset all progress
up.trigger('Error', {
code : plupload.HTTP_ERROR,
message : plupload.translate('HTTP Error.'),
file : file,
response : xhr.responseText,
status : xhr.status,
responseHeaders: xhr.getAllResponseHeaders()
});
}
}
//服务器端处理文件上传代码,简单实现了在处理有错误时返回错误状态,以供plupload的error方法调用显示提示框
//服务器端使用spring MVC ,代码如下:
@RequestMapping(value = "file", method = RequestMethod.POST)
public @ResponseBody
String uploadFile(@RequestParam("file") MultipartFile file,
@RequestParam("dataType") String dataType,
HttpServletResponse response ) {
UploadFile entity = new UploadFile(file.getOriginalFilename(), dataType);
if ("install".equals(dataType)) {
//读取文件内容并保存至数据库,如果错误返回boolean状态
boolean bl =excelReadAndSave(file);
//fileUploadInfoExcelRead(file);
if(bl){
uploadFileSerivce.save(entity);
}else{
//String str="die('{'jsonrpc':'2.0','error':{'code':501,'message':'Failed to open output stream.'},'id':'id'}')";
//如果文件处理错误,返回错误信息
//必须设置返回报文header信息状态,1300是随便取的,plupload插件回转换掉错误码,
//返回什么其实不重要,只要不是200正常状态就行
response.setStatus(1300);
return "{'error', 4}";
}
} else {
boolean bool =fileUploadInfoExcelRead(file);
if(bool){
uploadFileSerivce.save(entity);
}else{
response.setStatus(1300);
return "{'error', 4}";
}
}
return "{'success', 'true'}";
}