实现文件动态上传,大致的思路是这样的:
首先,利用Common Fileupload的ProgressListener接口讲实时的文件上传百分比存入session中,
然后,实现一个读取session的servlet,在web端利用ajax间隔一定时间请求这个servlet,
最后,将文件上传百分比显示在web端,并制作进度条。
1.实现ProgressListener
ServletFileUpload upload = new ServletFileUpload(upload_factory);
class UploadProgressListener implements ProgressListener{
private HttpServletRequest request;
private DecimalFormat df = new DecimalFormat("#00.0");
UploadProgressListener(HttpServletRequest request){
this.request = request;
}
@Override
public void update(long bytesRead, long bytesTotal, int items) {
double percent= (double)bytesRead*100/(double)bytesTotal;
System.out.println(df.format(percent));
request.getSession().setAttribute("UPLOAD_PERCENTAGE", df.format(percent));
}
}
upload.setProgressListener(new UploadProgressListener(request));2.实现读取session的servlet
HttpSession session = request.getSession();
Object is_begin = session.getAttribute("IS_UPLOAD_BEGIN");
if(is_begin==null) return;
if("0".equals(is_begin.toString())) return;
PrintWriter out = response.getWriter();
Object upload_percentage = session.getAttribute("UPLOAD_PERCENTAGE");
out.write("{percentage:'"+upload_percentage.toString()+"'}");
out.flush();3.web端间隔时间的ajax请求
function beginUpload(){
$("#progress_bar").show();
setInterval("getUploadMeter()",1000);
}
function getUploadMeter(){
$.post("UploadMeter",function(data){
var json = eval("("+data+")");
jQuery("#progress").css("width",json.percentage/100*200+"px");
jQuery("#msg").css("padding","5px").html(json.percentage+"%");
});
}



本文介绍了一种使用CommonFileupload的ProgressListener接口实现文件动态上传的方法。通过监听文件上传过程并更新session中的上传百分比,再结合定时AJAX请求读取上传进度,最终实现在Web前端动态展示文件上传进度。

4697

被折叠的 条评论
为什么被折叠?



