plupload 上传组件,后台用java实现

本文详细介绍了如何利用plupload组件在Web浏览器上进行友好文件上传,特别关注大文件的分块上传以克服上传限制。同时,展示了Java后端如何接收并处理这些分块数据,包括配置示例、关键代码解析以及导入Excel数据的流程。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Plupload 是一个Web浏览器上的界面友好的文件上传模块,可显示上传进度、图像自动缩略和上传分块。可同时上传多个文件。

由于可以实现把文件分块上传,所以可以满足在某些限制了上传大小的环境上传大文件的需求。

 

plupload可以运行在多种环境下,如:html5,flash,siverlight,html等。下面是使用siverlight环境的简单配置:

 

Js代码   收藏代码
  1. var uploader = new plupload.Uploader({  
  2.         runtimes : 'silverlight',  
  3.         browse_button : 'pickfiles',  
  4.         container : 'container',  
  5.         max_file_size : '20mb',  
  6.         url:"/"+CONTEXT_NAME+"/importFromExcelAction.uploadExcelFile.do",  
  7.         multipart: true,  
  8.         chunk_size : '10mb',//把大文件分割  
  9.         unique_names : true,  
  10.         urlstream_upload : true,  
  11.         multiple_queues : false,  
  12.         filters : [{title : "Excel文件", extensions : "xls,xlsx"}],  
  13.         silverlight_xap_url : '/'+CONTEXT_NAME+'/modules/common/attach/plupload/script/plupload.silverlight.xap'  
  14.     });  
  15.     uploader.bind("Init",function(up,params){  
  16.         $J('#filelist').html("<div>Current runtime: " + params.runtime + "</div>");  
  17.     });  
  18.     uploader.bind("FilesAdded",function(up,files){  
  19.         $J.each(files, function(i, file) {  
  20.             $J('#filelist').append(  
  21.                 '<div id="' + file.id + '">' +  
  22.                 file.name + ' (' + plupload.formatSize(file.size) + ') <b></b>' +  
  23.             '</div>');  
  24.         });  
  25.         up.refresh();  
  26.     });  
  27.       
  28.     $J("#uploadfiles").click(function(e){  
  29.         uploader.start();  
  30.         e.preventDefault();  
  31.     })  
  32.       
  33.     uploader.bind('UploadProgress'function(up, file) {  
  34.         $J('#' + file.id + " b").html(file.percent + "%");  
  35.     });  
  36.       
  37.     uploader.bind('Error'function(up, err) {  
  38.         $J('#filelist').append("<div>Error: " + err.code +  
  39.             ", Message: " + err.message +  
  40.             (err.file ? ", File: " + err.file.name : "") +  
  41.             "</div>"  
  42.         );  
  43.         up.refresh(); // Reposition Flash/Silverlight  
  44.     });  
  45.   
  46.     uploader.bind('FileUploaded'function(up, file) {  
  47.         $J('#' + file.id + " b").html("100%");  
  48.         $J('#filelist').append("<span>上传成功...</span><br/>");  
  49.         $J('#filelist').append("<span>开始处理Excel数据...</span><br/>");  
  50.         var request = $J.ajax({  
  51.             url:'/'+CONTEXT_NAME+'/importFromExcelAction.importExcel.do',  
  52.             type:"post",  
  53.             data:{  
  54.                     template:$J("#selectTemplate").val(),  
  55.                     fileName:file.name  
  56.                 }  
  57.         });  
  58.           
  59.         // 定时获取导入状态  
  60.         var task = window.setInterval("getImportStatus()",5000);  
  61.           
  62.         request.done(function(data){  
  63.             $J('#filelist').append("<span>success:"+data.success+",msg:"+data.msg+"</span><br/>");  
  64.             window.clearInterval(task);  
  65.         });  
  66.         request.fail(function(jqXHR, textStatus){  
  67.             $J('#filelist').append("<span>请求处理Excel数据失败:"+textStatus+"</span><br />");  
  68.             window.clearInterval(task);  
  69.         });  
  70.           
  71.           
  72.     });  
  73.       
  74.     uploader.init();  

 

而后台,可以使用FileInputStream的构造方法追加文件内容。new FileOutputStream(fullName,isAppend)

plupload使用“multipart/form-data”这种表单上传文件,其中每一个分块会发出一次请求,表单中有两个字段,分别是“chunk”和“chunks”,其中“chunk”是当前正在处理的文件分块的序号(从0开始计数),而“chunks”则是文件的分块总数。具体的实现:

 

Java代码   收藏代码
  1. /** 
  2.      * <p>使用plupload组件上传文件</p> 
  3.      * @param request 
  4.      * @param response 
  5.      * @param rePath 保存文件的相对路径,以WebRoot为根 
  6.      * @return 
  7.      */  
  8.     public static String uploadFiles(HttpServletRequest request,HttpServletResponse response, String rePath){  
  9.         String filename = null;  
  10.         int chunk = 0;// 当前正在处理的文件分块序号  
  11.         int chunks = 0;//分块上传总数  
  12.         boolean isMultipart = ServletFileUpload.isMultipartContent(request);  
  13.         // 判断当前表单是否为"multipart/form-data"  
  14.         if (isMultipart) {  
  15.             ServletFileUpload upload = new ServletFileUpload();  
  16.             //webroot绝对路径  
  17.             String webRootPath = FileHelper.getServerWebRoot();  
  18.             try {  
  19.                 FileItemIterator iter = upload.getItemIterator(request);  
  20.                 while (iter.hasNext()) {  
  21.                     FileItemStream item = iter.next();  
  22.                     String name = item.getFieldName();  
  23.                     InputStream input = item.openStream();  
  24.                       
  25.                     if("chunk".equals(name)) {  
  26.                         chunk = Integer.valueOf(Streams.asString(input));  
  27.                         continue;  
  28.                     }  
  29.                     if("chunks".equals(name)) {  
  30.                         chunks = Integer.valueOf(Streams.asString(input));  
  31.                         continue;  
  32.                     }  
  33.   
  34.                  // Handle a multi-part MIME encoded file.  
  35.                     if (!item.isFormField()) {  
  36.                         // 文件名  
  37.                         filename = item.getName();  
  38.                         // 保存文件目录绝对路径  
  39.                         File dir = new File(webRootPath+rePath);  
  40.                         if(!dir.isDirectory() || !dir.exists()){  
  41.                             dir.mkdir();  
  42.                         }  
  43.                           
  44.                         //保存文件绝对路径  
  45.                         String fullPath = webRootPath+rePath+"/"+filename;  
  46.                         if(chunk == 0){  
  47.                             File file = new File(fullPath);  
  48.                             if(file.exists()){  
  49.                                 file.delete();  
  50.                             }  
  51.                             //上传文件  
  52.                             FileHelper.uploadFile(input, fullPath);  
  53.                         }  
  54.                         if(chunk > 0){  
  55.                             //追加文件  
  56.                             FileHelper.uploadFile(input, fullPath, true);  
  57.                         }  
  58.                         if(chunk+1 == chunks || chunks == 0){  
  59.                             break;  
  60.                         }  
  61.                     }  
  62.                 }  
  63.             }  
  64.             catch (Exception e) {  
  65.                 log.error(e, e.fillInStackTrace());  
  66.                 e.printStackTrace();  
  67.             }  
  68.         }  
  69.           
  70.         return filename;  
  71.     }  

 

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值