AjaxFileUpload+Struts2实现多文件上传功能
程序员文章站
2022-06-17 23:09:41
本文重点给大家介绍ajaxfileupload+struts2实现多文件上传功能,具体实现代码大家参考下本文。
单文件和多文件的实现区别主要修改两点,
一是插件ajax...
本文重点给大家介绍ajaxfileupload+struts2实现多文件上传功能,具体实现代码大家参考下本文。
单文件和多文件的实现区别主要修改两点,
一是插件ajaxfileupload.js里接收file文件id的方式
二是后台action是数组形式接收
1、ajaxfileupload文件下载地址http://www.phpletter.com/demo/ajaxfileupload-demo/
2、引入jquery-1.8.0.min.js、ajaxfileupload.js文件
3、文件上传页面核心代码
<body> <form action="" enctype="multipart/form-data"> <h2> 多文件上传 </h2> <input type="file" id="file1" name="file" /> </br> <input type="file" id="file2" name="file" /> </br> <input type="file" id="file3" name="file" /> </br> <span> <table id="down"> </table> </span> </br> <input type="button" onclick="fileupload();" value="上传"> </form> </body> <script type="text/javascript"> function fileupload() { var files = ['file1','file2','file3']; //将上传三个文件 id 分别为file2,file2,file3 $.ajaxfileupload( { url : 'fileuploadaction', //用于文件上传的服务器端请求地址 secureuri : false, //一般设置为false fileelementid : files, //文件上传的id属性 <input type="file" id="file" name="file" /> datatype : 'json', //返回值类型 一般设置为json success : function(data, status) { var filenames = data.filefilename; //返回的文件名 var filepaths = data.filepath; //返回的文件地址 for(var i=0;i<data.filefilename.length;i++){ //将上传后的文件 添加到页面中 以进行下载 $("#down").after("<tr><td height='25'>"+filenames[i]+ "</td><td><a href='downloadfile?downloadfilepath="+filepaths[i]+"'>下载</a></td></tr>") } } }) } </script>
以上fileelementid属性接收的files参数为['file1','file2','file3']
由于是多文件,所以我们需要修改ajaxfileupload.js 找到以下代码
var oldelement = jquery('#' + fileelementid); var newelement = jquery(oldelement).clone(); jquery(oldelement).attr('id', fileid); jquery(oldelement).before(newelement); jquery(oldelement).appendto(form);
修改为:
for(var i in fileelementid){ var oldelement = jquery('#' + fileelementid[i]); var newelement = jquery(oldelement).clone(); jquery(oldelement).attr('id', fileid); jquery(oldelement).before(newelement); jquery(oldelement).appendto(form); }
4、文件上传action
public class fileaction { private file[] file; //文件 private string[] filefilename; //文件名 private string[] filepath; //文件路径 private string downloadfilepath; //文件下载路径 private inputstream inputstream; /** * 文件上传 * @return */ public string fileupload() { string path = servletactioncontext.getservletcontext().getrealpath("/upload"); file file = new file(path); // 判断文件夹是否存在,如果不存在则创建文件夹 if (!file.exists()) { file.mkdir(); } try { if (this.file != null) { file f[] = this.getfile(); filepath = new string[f.length]; for (int i = 0; i < f.length; i++) { string filename = java.util.uuid.randomuuid().tostring(); // 采用时间+uuid的方式随即命名 string name = filename + filefilename[i].substring(filefilename[i].lastindexof(".")); //保存在硬盘中的文件名 fileinputstream inputstream = new fileinputstream(f[i]); fileoutputstream outputstream = new fileoutputstream(path+ "\\" + name); byte[] buf = new byte[1024]; int length = 0; while ((length = inputstream.read(buf)) != -1) { outputstream.write(buf, 0, length); } inputstream.close(); outputstream.flush(); //文件保存的完整路径 // 如:d:\tomcat6\webapps\struts_ajaxfileupload\\upload\a0be14a1-f99e-4239-b54c-b37c3083134a.png filepath[i] = path + "\\" + name; } } } catch (exception e) { e.printstacktrace(); } return "success"; } /** * 文件下载 * @return */ public string downloadfile() { string path = downloadfilepath; httpservletresponse response = servletactioncontext.getresponse(); try { // path是指欲下载的文件的路径。 file file = new file(path); // 取得文件名。 string filename = file.getname(); // 以流的形式下载文件。 inputstream fis = new bufferedinputstream(new fileinputstream(path)); byte[] buffer = new byte[fis.available()]; fis.read(buffer); fis.close(); // 清空response response.reset(); // 设置response的header string filenamestring = new string(filename.getbytes("gbk"),"iso-8859-1"); response.addheader("content-disposition", "attachment;filename="+ filenamestring); response.addheader("content-length", "" + file.length()); outputstream toclient = new bufferedoutputstream(response.getoutputstream()); response.setcontenttype("application/octet-stream"); toclient.write(buffer); toclient.flush(); toclient.close(); } catch (ioexception ex) { ex.printstacktrace(); } return null; } /** * 省略set get方法 */ }
5、struts配置
<!doctype struts public "-//apache software foundation//dtd struts configuration 2.0//en" "http://struts.apache.org/dtds/struts-2.0.dtd"> <struts> <package name="ajax_code" extends="json-default"> <!-- 文件上传 --> <action name="fileuploadaction" class="com.itmyhome.fileaction" method="fileupload"> <result type="json" name="success"> <param name="contenttype">text/html</param> </result> </action> </package> <package name="jsp_code" extends="struts-default"> <!-- 文件下载 --> <action name="downloadfile" class="com.itmyhome.fileaction" method="downloadfile"> <result type="stream"> <param name="contenttype">application/octet-stream</param> <param name="inputname">inputstream</param> <param name="contentdisposition">attachment;filename=${filename}</param> <param name="buffersize">4096</param> </result> </action> </package> </struts>
浏览器中输入: 即可进行文件上传
如图:
项目源码下载:
总结
以上所述是小编给大家介绍的ajaxfileupload+struts2实现多文件上传功能,希望对大家有所帮助