之前在网上找过很多相关资料,很多所谓的批量上传都是忽悠人的,真正的批量上传指的是用户一次性可以选择多个文件,然后上传是将所有选取的文件上传到服务器。java中真正可以实现批量上传的技术大致有两种:一种是通过flash;一种是通过applet;不过html5也可以支持批量拖选。两种方式有各自的优缺点,其中flash对于浏览器兼容性较好,基本可以满足市面上大众浏览器,缺点就是对于上传文件大小有限制,如果用户只需要上传一些图片或者文档文件的话,这种选择还是比较理想的;applet方式可以上传大文件,但是需要浏览器支持jdk并安装相关插件。

今天这个项目采用的是flash方式。整体设计思路:采用ext+swfupload进行上传界面显示,后台采用strust2来处理上传文件。

最终项目运行效果图如下:


java批量上传插件 java实现批量上传_javascript

前台jsp文件源码index.jsp:


1. <%@pagecontentType="text/html;charset=gb2312"language="java"%>
2. <html>
3. <head>
4. <title>swf上传</title>
5. <linkrel="stylesheet"type="text/css"
6. href="js/css/ext-all.css"/>
7. 
8. </head>
9. 
10. 
11. 
12. <body>
13. <scripttype="text/javascript"src="js/ext-base.js"></script>
14. <scripttype="text/javascript"src="js/ext-all.js"></script>
15. <scriptsrc="swf/swfupload.js"type="text/javascript"></script>
16. <scriptsrc="swf/swfupload.speed.js"type="text/javascript"></script>
17. <scriptsrc="swf/mode.js"type="text/javascript"></script>
18. <scriptsrc="swf/handlers.js"type="text/javascript"></script>
19. <scripttype="text/javascript"src="js/prototype/prototype.js"></script>
20. <scripttype="text/javascript"src="js/bramus/jsProgressBarHandler.js"></script>
21. <scripttype="text/javascript">
22. //允许上传文件的全部大小
23. varlimtallsize=50000000;
24. 
25. functionUploadGrid()
26. {
27. varmine=this;
28. varstates=[{v:-1,t:'等待'},{v:0,t:'就绪'},{v:1,t:'上传中'},{v:2,t:'停止'},{v:3,t:'成功'},{v:4,t:'失败'}];
29. functionstatesRender(v)
30. {
31. for(vari=0;i<states.length;i++)
32. {
33. if(states[i].v==v)
34. {
35. returnstates[i].t;
36. }
37. }
38. }
39. functionrateRender(value,metaData,record,rowIndex,cellIndex,store)
40. {
41. v=value?value:0;
42. //return"<tableborder='0'cellpadding='0'cellspacing='0'width='100%'height='100%'><tr><tdbgcolor='#0000FF'height='100%'align='center'width='"+v+"%'><fontcolor='white'>"+v+"%</font></td><td></td></tr></table>";
43. //setProgress(v);
44. return"<spanid=\"element6_"+record.data.id+"\"rate=\""+v+"\"></span>";
45. }
46. 
47. varrn=newExt.grid.RowNumberer();
48. varsm=newExt.grid.CheckboxSelectionModel({singleSelect:false});
49. varcm=newExt.grid.ColumnModel([
50. rn,
51. sm,
52. {header:'文件名称',dataIndex:'fileName',menuDisabled:true,width:100},
53. {header:'大小',dataIndex:'fileSize',menuDisabled:true,width:100},
54. {header:'进度',dataIndex:'rate',menuDisabled:true,width:180,renderer:rateRender},
55. {header:'速度',dataIndex:'speed',menuDisabled:true},
56. {header:'状态',dataIndex:'state',menuDisabled:true,renderer:statesRender}
57. ]);
58. 
59. this.ds=newExt.data.Store({
60. proxy:newExt.data.HttpProxy({url:'test!query.action',method:'post'}),
61. remoteSort:false,
62. reader:newExt.data.JsonReader(
63. {totalProperty:'records',root:'root'},
64. [
65. {name:'id'},
66. {name:'fileName'},
67. {name:'code'},
68. {name:'fileSize'},
69. {name:'rate'},
70. {name:'speed'},
71. {name:'state'}
72. ])
73. 
74. });
75. 
76. varRC=Ext.data.Record.create([
77. {name:'id',mapping:'id'},
78. {name:'code',mapping:'code'},
79. {name:'fileName',mapping:'fileName'},
80. {name:'fileSize',mapping:'fileSize'},
81. {name:'rate',mapping:'rate'},
82. {name:'speed',mapping:'speed'}
83. ]);
84. 
85. this.grid=newExt.grid.GridPanel({
86. 
87. ds:mine.ds,
88. cm:cm,
89. sm:sm,
90. anchor:'100%',
91. loadMask:{msg:'数据加载中...'},
92. viewConfig:{forceFit:true},
93. height:300,
94. width:600,
95. tbar:[{id:'spanSWFUploadButton',text:'-'},'-'],
96. listeners:{
97. render:function()
98. {
99. //ytb-sep
100. varcmp=Ext.getCmp("spanSWFUploadButton");
101. varpcont=cmp.getEl().parent();
102. pcont.update("<spanid='spanSWFUploadButton'class='blank'></span>");
103. varswfu=newSWFUpload({
104. upload_url:"upload.action",
105. post_params:{
106. "god":"god","uid":"u"
107. },
108. 
109. flash_url:"swf/swfupload.swf",
110. button_placeholder_id:"spanSWFUploadButton",
111. button_image_url:"swf/bt.png",
112. button_text_right_padding:100,
113. button_width:61,
114. button_height:22,
115. 
116. button_action:SWFUpload.BUTTON_ACTION.SELECT_FILES,
117. //handlerhere
118. swfupload_loaded_handler:Handlers.swfUploadLoaded,
119. file_queued_handler:Handlers.fileQueued,
120. file_queue_error_handler:Handlers.fileQueueError,
121. upload_progress_handler:Handlers.uploadProgress,
122. upload_error_handler:Handlers.uploadError,
123. upload_success_handler:Handlers.uploadSuccess
124. });
125. swfu.grid=mine.grid;
126. swfu.ds=mine.ds;
127. swfu.RC=RC;
128. }
129. }
130. });
131. 
132. }
133. 
134. Ext.onReady(function(){
135. Ext.QuickTips.init();
136. Ext.form.Field.prototype.msgTarget='side';
137. Ext.BLANK_IMAGE_URL='../../images/s.gif';
138. vargrid=newUploadGrid();
139. varwin=newExt.Window({
140. title:'上传表格测试',
141. el:'panel',
142. width:620,
143. height:350,
144. closeAction:'hide',//关闭窗口时渐渐缩小
145. plain:true,
146. 
147. items:[grid.grid],
148. 
149. buttons:[{
150. text:'Submit',
151. disabled:true
152. },{
153. text:'Close',
154. handler:function(){
155. win.hide();
156. }
157. }]
158. });
159. win.show(this);
160. })
161. </script>
162. <divid="panel"></div>
163. </body>
164. </html>


后台UploadAction.java:


1. packageupload.action;
2. 
3. importjava.io.File;
4. importjava.text.DateFormat;
5. importjava.text.SimpleDateFormat;
6. importjava.util.Date;
7. importorg.apache.struts2.ServletActionContext;
8. 
9. publicclassUploadAction
10. {
11. privateFileFiledata;
12. 
13. privateStringFiledataFileName;
14. 
15. privateStringFiledataContentType;
16. 
17. //文件夹目录
18. privatestaticfinalStringbasePath="fileupload\\groupResource";
19. 
20. publicStringexecute()
21. {
22. 
23. Strings=(String)ServletActionContext.getRequest().getParameter("god");
24. Strings2=(String)ServletActionContext.getRequest().getParameter("uid");
25. if(Filedata!=null&&Filedata.length()>0)
26. {
27. //群组名字作为最后的文件夹
28. StringgroupFileName="haoba";
29. 
30. StringuploadPath=ServletActionContext.getServletContext()
31. .getRealPath(basePath+"\\"+groupFileName);
32. Filepath=newFile(uploadPath);
33. 
34. if(!path.exists())
35. {
36. path.mkdirs();
37. }else{
38. //文件已存在
39. //FiledataFileName
40. }
41. 
42. StringnewPath=uploadPath+"\\"+FiledataFileName;
43. Filedata.renameTo(newFile(newPath));
44. 
45. //保存到数据库中的路径
46. StringsavePath=basePath+"\\"+groupFileName+"\\"+FiledataFileName;
47. 
48. }
49. 
50. returnnull;
51. }
52. 
53. //上传文件
54. privateStringpathSplit(StringtimeStr,Stringo,Stringn)
55. {
56. StringBuffersb=newStringBuffer();
57. for(Stringa:timeStr.split(o))
58. {
59. sb.append(a);
60. sb.append(n);
61. }
62. sb.deleteCharAt(sb.length()-1);
63. returnsb.toString();
64. }
65. 
66. publicstaticStringformat(Datedate,Stringparttern)
67. {
68. DateFormatdf=newSimpleDateFormat(parttern);
69. returndf.format(date);
70. }
71. 
72. publicFilegetFiledata()
73. {
74. returnFiledata;
75. }
76. 
77. publicvoidsetFiledata(Filefiledata)
78. {
79. Filedata=filedata;
80. }
81. 
82. publicStringgetFiledataFileName()
83. {
84. returnFiledataFileName;
85. }
86. 
87. publicvoidsetFiledataFileName(StringfiledataFileName)
88. {
89. FiledataFileName=filedataFileName;
90. }
91. 
92. publicStringgetFiledataContentType()
93. {
94. returnFiledataContentType;
95. }
96. 
97. publicvoidsetFiledataContentType(StringfiledataContentType)
98. {
99. FiledataContentType=filedataContentType;
100. }
101. 
102. publicstaticvoidmain(String[]args){
103. System.out.println(0.444<1);
104. }
105. }