首页 > 代码库 > servlet多文件上传(带进度条)

servlet多文件上传(带进度条)

需要commons-fileupload-1.3.jar和commons-io-2.4.jar的支持

页面效果:(图片文件都可以)

(1)进度标识类

public class UploadStatus {     private long bytesRead;  	      private long contentLength;       private int items;        private long startTime = System.currentTimeMillis();    //set get 方法 省略}

(2)监听器

import org.apache.commons.fileupload.ProgressListener;public class UploadListener implements ProgressListener {		private UploadStatus status;  		//构造方法	public UploadListener(UploadStatus status) {		super();		this.status = status;	}      //重写方法	public void update(long bytesRead, long contentLength, int items) {		status.setBytesRead(bytesRead);		status.setContentLength(contentLength);		status.setItems(items);	}}

(3)action类(FileItem类是common中的方法)

public class UploadServlet extends HttpServlet {    //定义临时文件盒上传文件的存储路径      private File uploadTemp=null;      private File uploadPath=null;     	  public void doGet(HttpServletRequest request, HttpServletResponse response)			throws ServletException, IOException {	//禁用缓存,index.jsp后台会使用XmlHttpRequest调用本Servlet的doGet方法,从session中获取最新的上传数据情况          response.setHeader("Cache-Control", "no-store");          response.setHeader("Pragrma", "no-cache");          response.setDateHeader("Expires", 0);          response.setContentType("text/html;charset=utf-8");          UploadStatus status = (UploadStatus) request.getSession(true)                  .getAttribute("uploadStatus");                if (status == null) {              response.getWriter().println("没有上传信息");                            return;          }          long startTime = status.getStartTime();          long currentTime = System.currentTimeMillis();            // 已传输的时间 单位:s          long time = (currentTime - startTime) / 1000 + 1;            // 传输速度 单位:byte/s          double velocity = ((double) status.getBytesRead()) / (double) time;            // 估计总时间 单位:s          double totalTime = status.getContentLength() / velocity;            // 估计剩余时间 单位:s          double timeLeft = totalTime - time;            // 已完成的百分比          int percent = (int) (100 * (double) status.getBytesRead() / (double) status                  .getContentLength());            // 已完成数 单位:M          double length = ((double) status.getBytesRead()) / 1024 / 1024;            // 总长度 单位:M          double totalLength = ((double) status.getContentLength()) / 1024 / 1024;            // 格式:百分比||已完成数(M)||文件总长度(M)||传输速率(K)||已用时间(s)||估计总时间(s)||估计剩余时间(s)||正在上传第几个文件          String value = http://www.mamicode.com/percent +"||" + length + "||" + totalLength + "||"                  + velocity + "||" + time + "||" + totalTime + "||" + timeLeft                  + "||" + status.getItems();            response.getWriter().println(value);  	}		public void doPost(HttpServletRequest request, HttpServletResponse response)			throws ServletException, IOException {		File file=null;          String description=null;                    //设置响应格式(不设置请求格式,因为文件是二进制的,不能使用UTF-8格式化请求数据)          response.setContentType("text/html;charset=utf-8");                    PrintWriter out=response.getWriter();          out.println("<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">");          out.println("<HTML>");          out.println("<HEAD><TITLE>文件上传</TITLE></HEAD>");          out.println("<BODY style=‘margin:50px‘>");          out.println("上传日志:<BR/>");                    UploadStatus status=new UploadStatus();          UploadListener listener=new UploadListener(status);          /*          * 把 UploadStatus 放到 session 里,引用 		 * 返回与此请求关联的当前HttpSession,如果没有当前会话和创造是真实的,返回一个新的会话。 		 * 如果创建是假的,并要求有没有有效的HttpSession,这个方法返回null。          */          request.getSession(true).setAttribute("uploadStatus", status);                    //创建基于磁盘的工厂,针对大文件,临时文件将存储在磁盘          DiskFileItemFactory factory=new DiskFileItemFactory();          //设置缓冲区大小,超出该文件直接写入到磁盘的大小设置门槛。          factory.setSizeThreshold(10240);  //这里默认10KB          //设置用于大于配置的大小阈值设置的临时存储文件目录。          factory.setRepository(uploadTemp);          //创建一个文件上传的句柄          ServletFileUpload upload=new ServletFileUpload(factory);          //设置最大文件尺寸 ,这里是40MB                  upload.setSizeMax(41943040);          upload.setHeaderEncoding("utf-8");                    // 设置 listener          upload.setProgressListener(listener);                    try {              //将解析结果放在LIST中              List<FileItem> list =upload.parseRequest(request);              out.println("遍历所有的 FileItem ... <br/>");              // 遍历 list 中所有的 FileItem              for(FileItem item:list)              {                  // 如果是 文本域                  if(item.isFormField())                  {                      if(item.getFieldName().equals("description1")||item.getFieldName().equals("description2"))                      {                                                                        description = item.getString("UTF-8");                              System.out.println("文件名: "+item.getFieldName()+" ----描述-------"+description);                          }                  }                  else                   {                      //否则为文件域,当getName为Null说明没有选则文件                      if((item.getFieldName().equals("file1")||item.getFieldName().equals("file2"))                              &&item.getName()!=null&&!item.getName().equals(""))                      {                          try                           {                              // 统一 Linux 与 windows 的路径分隔符                              String fileName = item.getName();                              //fileName = fileName.substring(fileName.lastIndexOf("\\"));                                // 服务器端文件,放在 upload 文件夹下                              file=new File(uploadPath,fileName);                              if(!file.getParentFile().exists())                                  file.getParentFile().mkdirs();                              if(!file.exists())                                  file.createNewFile();                                                            item.write(file);                                                            System.out.println("遍历到 "+fileName+" ... <br/>"+description+"<BR/>");                              } catch (Exception e) {                              System.out.println("Request 上传失败!"+e.getMessage());                          }                          finally //总是立即删除保存表单字段内容的临时文件                          {                              item.delete();                          }                      }                  }              }              System.out.println("Request 解析完毕,文件上传完毕!");          } catch (Exception e) {              System.out.println("Request 解析异常!"+e.getMessage());          }          out.flush();          out.close();  	}	/**	 * Initialization of the servlet. <br>	 *	 * @throws ServletException if an error occurs	 */	public void init() throws ServletException {		// Put your code here		uploadPath=new File(this.getServletContext().getRealPath("upload"));          if(!uploadPath.exists())              uploadPath.mkdirs();                  uploadTemp=new File(this.getServletContext().getRealPath("upload/temp"));          if(!uploadTemp.exists())              uploadTemp.mkdirs();  	}}

(4)index.jsp页面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head> <title>带进度条的文件上传</title>  <style type="text/css">	 #progressBar{width:400px;height:12px;background:#FFFFFF;border:1px solid #000000;padding:1px;}	 #progressBarItem{width:30%;height:100%;background:#FF0000;} </style> <script type="text/JavaScript"> //默认为已经完成上传操作 var _finished=true; function $(obj) { return document.getElementById(obj); } //<!--显示进度条等信息--> function showStatus() { _finished=false; $(‘status‘).style.display=‘block‘; $(‘progressBarItem‘).style.width=‘1%‘; $(‘btnSubmit‘).disabled=true; //<!--隔1秒后执行一次--> setTimeout("requestStatus()",1000); } //<!--发送请求获取文件上传状态--> function requestStatus() { if(_finished) return; var req=createRequest(); req.open("GET","servlet/UploadServlet"); req.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); req.onreadystatechange=function(){callback(req);}; //我们的实例在 open() 的第三个参数中使用了 "true"。该参数规定请求是否异步处理。 //True 表示脚本会在 send() 方法之后继续执行,而不等待来自服务器的响应。  req.send(null); setTimeout("requestStatus()",1000); } function createRequest() {  if(window.XMLHttpRequest)//ns  {   return new XMLHttpRequest();  }else//IE  {   try{    return new ActiveXObject("Msxml2.XMLHTTP");   }catch(e){    return new ActiveXObject("Microsoft.XMLHTTP");   }  }  return null; } function callback(req) {   //请求结束后  if(req.readyState==4) {  //如果发生错误,则显示错误信息  if(req.status!=200) { _debug("发生错误。 req.status: " + req.status + "");    return; }    var ss = req.responseText.split("||");      // 格式:百分比||已完成数(M)||文件总长度(M)||传输速率(K)||已用时间(s)||估计总时间(s)||估计剩余时间(s)||正在上传第几个文件   $(‘progressBarItem‘).style.width = ‘‘ + ss[0] + ‘%‘;    $(‘statusInfo‘).innerHTML = ‘已完成百分比: ‘ + ss[0] + ‘% <br />已完成数(M): ‘ + ss[1] + ‘<br/>文件总长度(M): ‘ + ss[2] + ‘<br/>传输速率(K): ‘ + ss[3] + ‘<br/>已用时间(s): ‘ + ss[4] + ‘<br/>估计总时间(s): ‘ + ss[5] + ‘<br/>估计剩余时间(s): ‘ + ss[6] + ‘<br/>正在上传第几个文件: ‘ + ss[7];     if(ss[1] == ss[2]) {   _finished = true;   $(‘statusInfo‘).innerHTML += "<br/><br/><br/>上传已完成。";     $(‘btnSubmit‘).disabled = false;   }   _debug("status.jsp 返回值:" + req.responseText);   } } function _debug(obj) { //var div=document.createElement("DIV"); $(‘debug‘).innerHTML="[debug]:"+obj+"<br/>";  //document.body.appendChild(div);  } </script> </head>  <body style="margin:50px"> <iframe name="upload_iframe" width="0" height="0" frameborder="0" ></iframe>    <form action="servlet/UploadServlet" method="post" enctype="multipart/form-data"  target="upload_iframe" onsubmit="showStatus();">  <p>上传文件:</p>	  文件1:<input type="file" name="file1" /><br/>	  描述:<input type="text" name="description1" /><br/>	  文件2:<input type="file" name="file2" /><br/>	  描述:<input type="text" name="description2" /><br/>  <input type="submit" id="btnSubmit" value="http://www.mamicode.com/上 传" />   </form>  <div id="status" style="display:none;position:relative;line-height:100%;opacity:1;">  上传进度:  <div id="progressBar" ><div id="progressBarItem" /></div>  <div id="statusInfo" style="margin:10px 0px 0px 0px;"/>  </div>  <BR/>  <div id="debug" /> </body> </html>

  资源代码下载:http://download.csdn.net/detail/u011518709/8179663

  

  

  

servlet多文件上传(带进度条)