给文件上传添加进度条，整了两天终于成功了。
想要添加一个上传的进度条，通过分析，应该是需要不断的去访问服务器，询问上传文件的大小。通过已上传文件的大小，
和上传文件的总长度来评估上传的进度。
实现监听器ProgressListener接口，可以实时获取上传文件的长度。
public class FileUploadListener implements ProgressListener{
private HttpSession session;
public FileUploadListener(HttpServletRequest request) {
session = request.getSession();
FileState state = new FileState(); // 自定义FileState POJO类，储存状态信息
session.setAttribute("state", state);
}
@Override
public void update(long readedBytes, long totalBytes, int currentItem) {
// TODO Auto-generated method stub
//System.out.println("update:"+readedBytes+";"+totalBytes+";"+currentItem);
FileState state = (FileState) session.getAttribute("state");
state.setReadedBytes(readedBytes); // 已读数据的长度
state.setTotalBytes(totalBytes); // 文件总长度
state.setCurrentItem(currentItem); // 正在保存第几个文件
}
}
FileState类
public class FileState {
private long readedBytes = 0L; // 已经上传的字节数，单位：字节
private long totalBytes = 0L; // 所有文件的总长度，单位：字节
private int currentItem = ; // 正在上传第几个文件
private long startTime=System.currentTimeMillis(); //开始上传的时间，用于计算上传的速度
public long getStartTime() {
return startTime;
}
public void setStartTime(long startTime) {
this.startTime = startTime;
}
public long getReadedBytes() {
return readedBytes;
}
public void setReadedBytes(long readedBytes) {
this.readedBytes = readedBytes;
}
public long getTotalBytes() {
return totalBytes;
}
public void setTotalBytes(long totalBytes) {
this.totalBytes = totalBytes;
}
public int getCurrentItem() {
return currentItem;
}
public void setCurrentItem(int currentItem) {
this.currentItem = currentItem;
}
}
把监听器FileUploadListener 添加到MyJakartaMultiPartRequest类中。MyJakartaMultiPartRequest类是Struts2源码中的JakartaMultiPartRequest类。
在此类中添加进度监听器，并覆盖此类。
private List<FileItem> parseRequest(HttpServletRequest servletRequest, String saveDir) throws FileUploadException {
/* FileState fileState=new FileState();
servletRequest.getSession().setAttribute("state", fileState);*/
DiskFileItemFactory fac = createDiskFileItemFactory(saveDir);
ServletFileUpload upload = new ServletFileUpload(fac);
upload.setSizeMax(maxSize);
// add 设置进度监听器
upload.setProgressListener(new FileUploadListener(servletRequest));
// end
return upload.parseRequest(createRequestContext(servletRequest));
}
在xml中配置
<!-- 配置自定义文件类myrefactor，继承MultiPartRequest重写 -->
<bean type="org.apache.struts2.dispatcher.multipart.MultiPartRequest" name="myrefactor"
class="com.service.MyJakartaMultiPartRequest" scope="default" optional="true" />
action
public class FileProgressAction {
/**
* 显示文件上传的进度
*/
public String execute(){
HttpServletResponse response= ServletActionContext.getResponse();
response.setHeader("Cache-Control", "no-store"); //禁止浏览器缓存
response.setHeader("Pragrma", "no-cache"); //禁止浏览器缓存
response.setDateHeader("Expires", ); //禁止浏览器缓存
Map session=ActionContext.getContext().getSession();
PrintWriter out = null;
try {
out = response.getWriter();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
FileState status = (FileState)session.get("state");
if(status == null){
//renderText("error");
return null;
}
long startTime = status.getStartTime(); //上传开始时间
long currentTime = System.currentTimeMillis(); //现在时间
long time = (currentTime - startTime)/ + ; //已传输的时间 单位:s
//传输速度单位:byte/s
double velocity = ((double)status.getReadedBytes()) / (double)time;
//估计总时间
double totalTime = status.getTotalBytes();
//估计剩余时间
double timeLeft = totalTime - time;
//已经完成的百分比
int percent = (int)( * (double)status.getReadedBytes() / (double)status.getTotalBytes());
//已经完成数单位:m
double length = ((double) status.getReadedBytes())//;
//总长度 单位:m
double totalLength = ((double) status.getTotalBytes())//;
JSONObject json = new JSONObject();
json.put("percent", percent);
json.put("length", length);
json.put("totalLength", totalLength);
json.put("velocity", velocity);
json.put("time", time);
json.put("totalTime", totalTime);
json.put("timeLeft", timeLeft);
json.put("fileNumber", status.getCurrentItem());
// System.out.println(json.toString());
out.print(json.toString());
return null;
}
}
js
var finished = true; //上传是否结束
function showStatus(){
finished = false;
/*$('#progressBarItem').attr('width','1%');*/ setTimeout('callback()',);
} function callback(){
if(finished) return;
var url = 'fileProgressAction';
$.get(url,function(dataSrc){
var dataS=eval("("+dataSrc+")");
$('#progressBarItem').html("("+dataS.percent+"%"+")");
//alert(dataS.percent);
}); setTimeout('callback()',);
}
jsp
<div style="width: 86px;float: left;margin-top: 15px;margin-left: 5px;">
<form action="filesUpload" method="post" enctype="multipart/form-data" style="margin-top: 16px;" onsubmit="return subClick()" >
<a href="javascript:;" class="file">
<img alt="tip" src="data:images/upload.png" style="width: 55px;">
<input type="file" name="myFile" multiple="multiple" id="myFile" value="" onchange="uplaodfileOnChange(this)">
</a>
<input type="submit" value="上传文件" style="margin-top: 3px;display: none;" id="sub" class="a-upload" onclick="wait()" />
<div id="fileDiv"></div>
<div style="margin-left: 7px;margin-top: 3px;width: 300px;" id="messageDiv" class="tip">${message} </div>
<%-- <span class="tip" id="perMessage"> ${request.perMessage} </span> --%>
</form>
<div id="error" class="tip" style="width: 1024px;"> <s:fielderror> </s:fielderror></div>
</div>