给文件上传添加进度条,整了两天终于成功了。

  想要添加一个上传的进度条,通过分析,应该是需要不断的去访问服务器,询问上传文件的大小。通过已上传文件的大小,

和上传文件的总长度来评估上传的进度。

  实现监听器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>

struts2上传文件添加进度条的更多相关文章

  1. layui上传文件配合进度条

    首先看一下效果图: 修改layui的源文件upload.js 1.打开layui/modules/upload.js 2.搜索ajax 3.找到url: 4.添加以下代码: ,xhr:l.xhr(fu ...

  2. jQuery上传文件显示进度条

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script sr ...

  3. Extjs 使用fileupload插件上传文件 带进度条显示

    一.首先我们看看官方给出的插件的解释: 一个文件上传表单项具有自定义的样式,并且可以控制按钮的文本和 像文本表单的空文本类似的其他特性. 它使用一个隐藏的文件输入元素,并在用户选择文件后 在form提 ...

  4. asp.net mvc 实现上传文件带进度条

    本文乃是博主早期写的,此种思路虽然实现了,但固然不是最好的,仅做参考学习. 可以用js onprogress .fileinput .webuploader.jq ajaxsubmit等实现 思路:a ...

  5. vue项目上传文件以及进度条

    最近做项目的时候,需要上传自定义镜像.并且附带进度条,上网查询一下资料,经过一番折磨,也总算做出来了,把自己写项目的内容给大家分享一下. 先直接贴代码吧 1.首先声明一个formData对象. 2.把 ...

  6. XMLHttpRequest上传文件实现进度条

    话不多说,直接上代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  7. FormData上传文件 带进度条

    * jQuery ajax  FormData 上传文件 template $.ajax({ url: url, type: 'POST', data: new FormData(form), dat ...

  8. ASP.NET Jquery+ajax上传文件(带进度条)

    效果图 支持ie6+,chrome,ie6中文文件名会显示乱码. 上传时候会显示进度条. 需要jquery.uploadify.js插件,稍后会给出下载 前台代码 <%@ Page Langua ...

  9. ajaxSubmit() 上传文件和进度条显示

    1.  首先引用js文件 <script type="text/javascript" src="/js/jquery/jquery.form.js"&g ...

随机推荐

  1. 【BZOJ-2342】双倍回文 Manacher + 并查集

    2342: [Shoi2011]双倍回文 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 1799  Solved: 671[Submit][Statu ...

  2. 【BZOJ-3996】线性代数 最小割-最大流

    3996: [TJOI2015]线性代数 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 1054  Solved: 684[Submit][Statu ...

  3. gulp用途

    前端构建工具,可以实现文件合并.文件压缩.语法检查.监听文件变化 参看: http://blog.sina.com.cn/s/blog_6592d8070102vmuq.html https://se ...

  4. Jenkins用HTTP Request Plugin插件进行网站的监控(运维监控)

    使用的插件: [HTTP Request Plugin] 思路: 说明:只能是网站是否正常打开,而不能是这个网站业务是否正常,如果是后者,则需要写特定的接口进行请求处理. 1.通过插件,发送GET请求 ...

  5. 关于当一个C#工程移植到另一台机子上(win7)上时,程序报错。dll没有被指定在Windows上运行,或者它包含错误。请尝试使用原始安装媒体重新安装程序。。。。。。

    , 解决方法:通过从网上重新下载dll文件 拷贝到报错的目录下,替换掉原有的dll,可以正确运行.

  6. CentOS 7.0 安装配置LAMP服务器方法(Apache+PHP+MariaDB)

    一.配置防火墙,开启80端口.3306端口 CentOS 7.0默认使用的是firewall作为防火墙,这里改为iptables防火墙. 1.关闭firewall: #停止firewall服务 sys ...

  7. Alpha版本十天冲刺——Day 3

    站立式会议 会议总结 队员 今天完成 遇到的问题 明天要做 感想 鲍亮 Android端登录验证接口 子线程无法返回从服务器获取的信息. 注册接口.忘记密码接口 开发经验不足,有一个问题不知道怎么解决 ...

  8. iOS - UITextfield 验证邮箱格式

    做登录界面时,用户在UITextfield中输入输入邮箱账号后,我们应该在本地验证格式是否正确,再将参数传给服务器验证. 最简单的就是利用系统的NSPredicate //利用正则表达式验证 -(BO ...

  9. React Native 开发之 (04) 例子讲解

    一.了解index.ios.js React-Native就是在开发效率和用户体验间做的一种权衡.React-native是使用JS开发,开发效率高.发布能力强,不仅拥有hybrid的开发效率,同时拥 ...

  10. Nginx系列1之部分模块详解

    1 内核模块: 名称: daemon 语法: daemon on |off 默认值: on 功能: 决定nginx 在前台执行还是后台守护进程执行的 ================== 名称: En ...