ajax上传文件进度条实现

主要是通过UploadListener 监听服务端接收了多少字节，返回给客户端，由javascript,div,css来操作进度条的显示
public class UploadListener implements OutputStreamListener
{
private HttpServletRequest request;
private long delay = 0;
private long startTime = 0;
private int totalToRead = 0;
private int totalBytesRead = 0;
private int totalFiles = -1;

public UploadListener(HttpServletRequest request, long debugDelay)
{
this.request = request;
this.delay = debugDelay;
totalToRead = request.getContentLength();
this.startTime = System.currentTimeMillis();
}

public void start()
{
totalFiles ++;
updateUploadInfo("start");
}

public void bytesRead(int bytesRead)
{
totalBytesRead = totalBytesRead + bytesRead;
updateUploadInfo("progress");

try
{
Thread.sleep(delay);
}
catch (InterruptedException e)
{
e.printStackTrace();
}
}

public void error(String message)
{
updateUploadInfo("error");
}

public void done()
{
updateUploadInfo("done");
}

private long getDelta()
{
return (System.currentTimeMillis() - startTime) / 1000;
}

private void updateUploadInfo(String status)
{
long delta = (System.currentTimeMillis() - startTime) / 1000;
request.getSession().setAttribute("uploadInfo", new UploadInfo(totalFiles, totalToRead, totalBytesRead,delta,status));
}

}

上面的代码中，原作者为了演示本机操作上的显示效果，特别加入了debugDelay做延时处理，在实际应用中可以删除。

upload.jsp:
<%@ page import="be.telio.mediastore.ui.upload.MonitoredDiskFileItemFactory" %>
<%@ page import="be.telio.mediastore.ui.upload.UploadListener" %>
<%@ page import="org.apache.commons.fileupload.FileItem" %>
<%@ page import="org.apache.commons.fileupload.FileItemFactory" %>
<%@ page import="org.apache.commons.fileupload.FileUploadException" %>
<%@ page import="org.apache.commons.fileupload.servlet.ServletFileUpload" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--
/* Licence:
* Use this however/wherever you like, just don't blame me if it breaks anything.
*
* Credit:
* If you're nice, you'll leave this bit:
*
* Class by Pierre-Alexandre Losson -- http://www.telio.be/blog
* email : plosson@users.sourceforge.net
*/
--%>
<%
UploadListener listener = new UploadListener(request, 30);

// Create a factory for disk-based file items
FileItemFactory factory = new MonitoredDiskFileItemFactory(listener);

// Create a new file upload handler
ServletFileUpload upload = new ServletFileUpload(factory);

try
{
// process uploads ..
upload.parseRequest(request);
//....处理上传文件
}
catch (FileUploadException e)
{
e.printStackTrace(); //To change body of catch statement use File | Settings | File Templates.
}
%>


整个应用已经打包放在附件里，请下载研究。