servlet.Ajax实现上传文件进度条

这里关于servlet如何上传文件就先不说了,将如何得到已经上传的文件数据的百分比...

首先我们先写一个类这个类要实现ProgressListener这个接口,实现里面的update(...)方法.代码如下

package com.test.servlet;

import java.text.DecimalFormat;

import javax.servlet.http.HttpServletRequest;

import org.apache.commons.fileupload.ProgressListener;

public class UploadProgressListener implements ProgressListener
{
	
	private HttpServletRequest request = null ;

	private DecimalFormat decimalFormat = new DecimalFormat("#00.0");
	
	
	
	public UploadProgressListener(HttpServletRequest request)
	{
		this.request = request;
	}
	
	public void update(long pBytesRead, long pContentLength, int pItems)
	{
		
		 double percent= (double)pBytesRead*100/(double)pContentLength; 
		 
		 String hadDownloadPercent = decimalFormat.format(percent).toString();
	
		request.getSession().setAttribute("hadDownloadPercent",hadDownloadPercent) ;
		
	}

}

这个类写完之后,我们再写一个servlet,这个servlet用于被Ajax在短暂的时间内不断请求数据,比如请求间隔是100ms

上代码

package com.test.servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

public class ReadProgressInSessionServlet extends HttpServlet
{
public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException
	{
HttpSession session = request.getSession();
		
		String hadDownloadPercent = (String)session.getAttribute("hadDownloadPercent");
		
		response.setCharacterEncoding("utf-8");
		
		PrintWriter printWriter = response.getWriter();
		
		printWriter.write(hadDownloadPercent);
		
		printWriter.flush();
	}

public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException
	{

	this.doGet(request,response);
		
	}

}

还有一个就是上传文件的核心类

ServletFileUpload servletFileUpload = new ServletFileUpload(
				diskFileItemFactory);

		servletFileUpload.setProgressListener(new UploadProgressListener(req));

其中req是HttpServletRequest对象 UploadProgressListener是ProgressListener接口的实现类...

最后就是通过JavaScript频繁的发起http请求,也就是Ajax...不过这种方式可能对服务器性能造成影响...

	
		function f()
		{
			var demonstrateHadUploadFileSizeArea = document.getElementById("demonstrateHadUploadFileSizeArea");
			
			var idiv=document.getElementById('hadUploadPercent');
			var ibox=document.getElementById('demonstrateArea');
			
			var url = "ReadProgressInSessionServlet"  ;
			
			
			
			//alert(url);
			
			var xmlHttpRequest = null ;
			
			if(window.ActiveXObject)	
			{
				xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP"); 
				
			}
			else if(window.XMLHttpRequest)	
			{
				xmlHttpRequest = new XMLHttpRequest();
			}
			
			if(null != xmlHttpRequest)
			{
				
				xmlHttpRequest.open("GET", url.toString(), true);
				
				xmlHttpRequest.onreadystatechange = ajaxCallBack;

				xmlHttpRequest.send(null);
			}
			
			function ajaxCallBack()
			{
				if(xmlHttpRequest.readyState == 4)
				{
					if(xmlHttpRequest.status == 200)
					{
						
						
						var responseText = xmlHttpRequest.responseText;
						
						//demonstrateHadUploadFileSizeArea.innerHTML = responseText;
						
						var iWidth = responseText;
						
						idiv.style.width=idiv.offsetWidth+1+'px';
						
						idiv.innerHTML= Math.round(iWidth)+"%";
						
					}
				}
			}
			
		}
		
		function g()
		{
			setInterval("f()",5);
			
		}