SpringMVC实现文件上传进度条

  文件上传一般都是基于commons-fileupload组件来实现，SpringMVC的文件上传功能也是在commons-fileupload组件提供的功能上面做了一些包装功能.

   Commons-fileupload组件自带了文件上传进度的监听器，类FileUploadBase提供了它的set方法：

 

public void setprogressListener(ProgressListener pListener)

          {

listener = pListener;

          }

ProgressListener是一个接口，我们需要自己实现它的update方法，参数pBytesRead表示已经上传到服务器的字节数，pContentLength表示所有文件的总大小，pItems表示第几个文件：

        protected FileUpload newFileUpload(FileItemFactory fileItemFactory)

{

return new ServletFileUpload(fileItemFactory);

}

我们要做的就是实现ProgressListener类

public class FileUploadListener implements ProgressListener {

private long num100Ks = 0;

private long theBytesRead = 0;

private long theContentLength = -1;

private int whichItem = 0;

private int percentDone = 0;

private boolean contentLengthKnown = false;

public void update(long bytesRead, long contentLength, int items) {

if (contentLength > -1) {

contentLengthKnown = true;

}

theBytesRead = bytesRead;

theContentLength = contentLength;

whichItem = items;

long nowNum100Ks = bytesRead / 100000;

if (nowNum100Ks > num100Ks) {

num100Ks = nowNum100Ks;

if (contentLengthKnown) {

percentDone = (int) Math.round(100.00 * bytesRead / contentLength);

}

}

}

public int getPercentDone() {

return percentDone;

}

}

SpringMVC没有实现监听器，所以如果要监听的话得自己扩展CommonsMultipartResolver类，在newFileUpload里面加入代码设置自己实现的监听器：

public class CommonsMultipartResolverExt extends CommonsMultipartResolver {

private HttpServletRequest request;

@Override

protected  FileUpload newFileUpload(FileItemFactory fileItemFactory)

{

ServletFileUpload upload = new ServletFileUpload(fileItemFactory); 

upload.setSizeMax(-1); 

if(request!=null)

{

///System.out.println("注入监听");

FileUploadListener uploadProgressListener = new FileUploadListener();

upload.setProgressListener(uploadProgressListener);

HttpSession session = request.getSession();

session.setAttribute("uploadProgressListener", uploadProgressListener);

}

return upload;

}

@Override

public MultipartHttpServletRequest resolveMultipart(HttpServletRequest request) throws MultipartException {

       this.request=request;//获取到 request,要用到session

       return super.resolveMultipart(request);

 }

}

建一个servlet用ajax去取进度就可以了

public class ProgressServlet extends HttpServlet {

private static final long serialVersionUID = 1L;

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

doPost(request, response);

}

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

response.setContentType("text/html");

response.setHeader("Cache-Control", "no-cache");

PrintWriter out = response.getWriter();

HttpSession session = request.getSession(true);

if (session == null) {

out.println("Sorry, session is null"); // just to be safe

return;

}

FileUploadListener uploadProgressListener = (FileUploadListener) session.getAttribute("uploadProgressListener");

if (uploadProgressListener == null) {

out.println("Progress listener is null");

return;

}

int ret=uploadProgressListener.getPercentDone();

System.out.println("new ->:"+String.valueOf(ret));

out.println(ret);

}

}

1. 在Spring的配置文件中添加 Xml代码  
2. id="multipartResolver" class="net.gkyh.filter.CommonsMultipartResolverExt">  
3. name="defaultEncoding" value="UTF-8" />  

Spring Controller

@RequestMapping(value="/AppUpload.action",method=RequestMethod.POST)

public ModelAndView Upload(HttpServletRequest request,HttpServletResponse response,

@RequestParam("flag")String flag,ModelMap modelMap){

try

{

String path= request.getSession().getServletContext().getRealPath("/");

path=path.substring(0,path.length()-1);

 int p=path.lastIndexOf("\");

path=path.substring(0,p);

path=path.replace("\","/");

String folderPath=path+"/ftp/upload/";

 

MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;  

            CommonsMultipartFile file = (CommonsMultipartFile) multipartRequest.getFile("filedata");

 // filedata  是表单的名字

                   

InputStream stream = file.getInputStream();  

String fileName = file.getOriginalFilename(); 

//System.out.println(fileName);

          String fileNameFull = folderPath +fileName;  

          OutputStream bos = new FileOutputStream(fileNameFull);  

          int bytesRead = 0;  

          byte[] buffer = new byte[8192];  

          while ((bytesRead = stream.read(buffer, 0, 8192)) != -1) {  

               bos.write(buffer, 0, bytesRead);  

          }  

 

          bos.close();  

          stream.close();  

  modelMap.put("msg","添加成功"); 

}

catch(Exception e) {

e.printStackTrace();

}

return  new ModelAndView("/appupload",modelMap);

}

jsp页面

  <SCRIPT src="../js/jquery-1.3.2.min.js" type="text/javascript"></SCRIPT>

<SCRIPT type=text/javascript>

function doProgressLoop(prog, max, counter) { 

    var x = document.getElementByIdx_x_x('progress-content').innerHTML;

    var y = parseInt(x);

    if (!isNaN(y)) {

    prog = y;

    }

counter = counter + 1;

    if (prog < 100) {

    setTimeout("getProgress()", 1000);

    setTimeout("doProgressLoop(" + prog + "," + max + "," + counter + ")", 1500);

document.getElementByIdx_x_x('progressBarText').innerHTML = 'upload in progress: ' + prog + '%';

document.getElementByIdx_x_x('progressBarBoxContent').style.width = parseInt(prog) + '%';

    }

}

function getProgress() {

$.ajax({

        type: "post",

        dataType: "string",

        url: "ProgressServlet.do",

        data: "",

        success: function (data) {          

            document.getElementByIdx_x_x('progress-content').innerHTML=data;

        },

        error: function (err) {

           document.getElementByIdx_x_x('progressBarText').innerHTML="Error retrieving progress";

        }

    });

}

   

function fSubmit()

{

var button = window.document.getElementByIdx_x_x("submitButton");

button.disabled = true;

var max = 100;

var prog = 0;

var counter = 0;

document.getElementByIdx_x_x('progressBar').style.display = 'block';

document.getElementByIdx_x_x('progressBarText').innerHTML = 'upload in progress: 0%';

getProgress();

doProgressLoop(prog, max, counter);

document.getElementByIdx_x_x("form1").submit();

}

</SCRIPT>

<form name="form1" id="form1" action="AppLoad.action" method="post" enctype="multipart/form-data">

<span>选择文件</span>

<div style="padding-bottom:5px;">

<input type="file" size="48" name="filedata" id='filedata'>

</div>

<div id="progressBar" style="display: none;"> 

<div id="theMeter"> 

<div id="progressBarText"></div> 

<div id="progressBarBox" style="color:Silver;border-width:1px;border-style:Solid;width:300px;TEXT-ALIGN:left"> 

<div id="progressBarBoxContent" style="background-color:#3366FF; height:15px; width:0%;TEXT-ALIGN:left"></div> 

</div>

<div id="progress-content" style="display: none;"></div>

</div> 

</div>

<INPUT  id='submitButton'  tabIndex=3 type=button value="提交" οnclick='fSubmit();' >

</form>

以下链接是servlet上传文件进度实例,本文使用了部分内容

http://www.avajava.com/tutorials/lessons/how-do-i-display-file-upload-progress-using-the-dojo-progressbar.html?page=1