URL:http://blog.csdn.net/xuweilinjijis/article/details/8876305

之前在网上找过很多相关资料,很多所谓的批量上传都是忽悠人的,真正的批量上传指的是 用户一次性可以选择多个文件,然后上传是将所有选取的文件上传到服务器。java中真正可以实现批量上传的技术大致有两种:一种是通过flash;一种是 通过applet;不过html5也可以支持批量拖选。两种方式有各自的优缺点,其中flash对于浏览器兼容性较好,基本可以满足市面上大众浏览器,缺 点就是对于上传文件大小有限制,如果用户只需要上传一些图片或者文档文件的话,这种选择还是比较理想的;applet方式可以上传大文件,但是需要浏览器 支持jdk并安装相关插件。

今天这个项目采用的是flash方式。整体设计思路:采用ext+swfupload进行上传界面显示,后台采用strust2来处理上传文件。

最终项目运行效果图如下:

前台jsp文件源码index.jsp:

<%@ page contentType="text/html;charset=gb2312" language="java"%>
<html>
<head>
<title>swf 上传</title>
<link rel="stylesheet" type="text/css"
href="js/css/ext-all.css" /> </head> <body>
<script type="text/javascript" src="js/ext-base.js"></script>
<script type="text/javascript" src="js/ext-all.js"></script>
<script src="swf/swfupload.js" type="text/javascript"></script>
<script src="swf/swfupload.speed.js" type="text/javascript"></script>
<script src="swf/mode.js" type="text/javascript"></script>
<script src="swf/handlers.js" type="text/javascript"></script>
<script type="text/javascript" src="js/prototype/prototype.js"></script>
<script type="text/javascript" src="js/bramus/jsProgressBarHandler.js"></script>
<script type="text/javascript">
// 允许上传文件的全部大小
var limtallsize=50000000; function UploadGrid()
{
var mine=this;
var states=[{v:-1,t:'等待'},{v:0,t:'就绪'},{v:1,t:'上传中'},{v:2,t:'停止'},{v:3,t:'成功'},{v:4,t:'失败'}];
function statesRender(v)
{
for(var i=0;i<states.length ;i++)
{
if(states[i].v==v)
{
return states[i].t;
}
}
}
function rateRender(value, metaData, record, rowIndex, cellIndex, store)
{
v=value?value:0;
//return "<table border='0' cellpadding='0' cellspacing='0' width='100%' height='100%'><tr><td bgcolor='#0000FF' height='100%' align='center' width='"+v+"%'><font color='white'>"+v+"%</font></td><td></td></tr></table>";
//setProgress(v);
return "<span id=\"element6_"+record.data.id+"\" rate=\""+v+"\"></span>";
} var rn=new Ext.grid.RowNumberer();
var sm = new Ext.grid.CheckboxSelectionModel({singleSelect:false});
var cm = new Ext.grid.ColumnModel([
rn,
sm,
{header:'文件名称',dataIndex:'fileName',menuDisabled:true,width: 100},
{header:'大小' ,dataIndex:'fileSize',menuDisabled:true,width: 100},
{header:'进度' ,dataIndex:'rate',menuDisabled:true,width: 180,renderer:rateRender},
{header:'速度' ,dataIndex:'speed',menuDisabled:true},
{header:'状态' ,dataIndex:'state',menuDisabled:true,renderer:statesRender}
]); this.ds = new Ext.data.Store({
proxy: new Ext.data.HttpProxy({url:'test!query.action',method:'post'}),
remoteSort:false,
reader: new Ext.data.JsonReader(
{totalProperty:'records',root:'root'},
[
{name: 'id'},
{name: 'fileName'},
{name: 'code'},
{name: 'fileSize'},
{name: 'rate'},
{name: 'speed'},
{name: 'state'}
]) }); var RC=Ext.data.Record.create([
{name: 'id', mapping: 'id'},
{name: 'code', mapping: 'code'},
{name: 'fileName', mapping: 'fileName'},
{name: 'fileSize', mapping: 'fileSize'},
{name: 'rate', mapping: 'rate'},
{name: 'speed', mapping: 'speed'}
]); this.grid = new Ext.grid.GridPanel({ ds: mine.ds,
cm: cm,
sm: sm,
anchor:'100%',
loadMask:{msg:'数据加载中...'},
viewConfig:{forceFit:true},
height:300,
width :600,
tbar:[{id:'spanSWFUploadButton',text:'-'},'-'],
listeners:{
render:function()
{
// ytb-sep
var cmp=Ext.getCmp("spanSWFUploadButton");
var pcont=cmp.getEl().parent();
pcont.update("<span id='spanSWFUploadButton' class='blank'></span>");
var swfu = new SWFUpload({
upload_url : "upload.action",
post_params : {
"god" : "god","uid" : "u"
}, flash_url : "swf/swfupload.swf",
button_placeholder_id : "spanSWFUploadButton",
button_image_url : "swf/bt.png",
button_text_right_padding : 100,
button_width: 61,
button_height : 22, button_action : SWFUpload.BUTTON_ACTION.SELECT_FILES,
// handler here
swfupload_loaded_handler : Handlers.swfUploadLoaded,
file_queued_handler : Handlers.fileQueued,
file_queue_error_handler : Handlers.fileQueueError,
upload_progress_handler : Handlers.uploadProgress,
upload_error_handler : Handlers.uploadError,
upload_success_handler : Handlers.uploadSuccess
});
swfu.grid=mine.grid;
swfu.ds=mine.ds;
swfu.RC=RC;
}
}
}); } Ext.onReady(function(){
Ext.QuickTips.init();
Ext.form.Field.prototype.msgTarget = 'side';
Ext.BLANK_IMAGE_URL ='../../images/s.gif';
var grid=new UploadGrid();
var win = new Ext.Window({
title:'上传表格测试',
el:'panel',
width:620,
height:350,
closeAction:'hide',//关闭窗口时渐渐缩小
plain: true, items:[grid.grid], buttons: [{
text:'Submit',
disabled:true
},{
text: 'Close',
handler: function(){
win.hide();
}
}]
});
win.show(this);
})
</script>
<div id="panel"></div>
</body>
</html>

后台UploadAction.java:

    package upload.action;  

    import java.io.File;
import java.text.DateFormat;
import java.text.SimpleDateFormat;
import java.util.Date;
import org.apache.struts2.ServletActionContext; public class UploadAction
{
private File Filedata; private String FiledataFileName; private String FiledataContentType; // 文件夹目录
private static final String basePath = "fileupload\\groupResource"; public String execute()
{ String s = (String)ServletActionContext.getRequest().getParameter("god");
String s2 = (String)ServletActionContext.getRequest().getParameter("uid");
if (Filedata != null && Filedata.length() > 0)
{
// 群组名字作为最后的文件夹
String groupFileName = "haoba"; String uploadPath = ServletActionContext.getServletContext()
.getRealPath(basePath+"\\"+groupFileName);
File path = new File(uploadPath); if (!path.exists())
{
path.mkdirs();
}else{
//文件已存在
//FiledataFileName
} String newPath = uploadPath +"\\"+FiledataFileName;
Filedata.renameTo(new File(newPath)); // 保存到数据库中的路径
String savePath = basePath+"\\"+groupFileName+"\\"+FiledataFileName; } return null;
} // 上传文件
private String pathSplit(String timeStr, String o, String n)
{
StringBuffer sb = new StringBuffer();
for (String a : timeStr.split(o))
{
sb.append(a);
sb.append(n);
}
sb.deleteCharAt(sb.length() - 1);
return sb.toString();
} public static String format(Date date, String parttern)
{
DateFormat df = new SimpleDateFormat(parttern);
return df.format(date);
} public File getFiledata()
{
return Filedata;
} public void setFiledata(File filedata)
{
Filedata = filedata;
} public String getFiledataFileName()
{
return FiledataFileName;
} public void setFiledataFileName(String filedataFileName)
{
FiledataFileName = filedataFileName;
} public String getFiledataContentType()
{
return FiledataContentType;
} public void setFiledataContentType(String filedataContentType)
{
FiledataContentType = filedataContentType;
} public static void main(String[] args) {
System.out.println(0.444<1);
}
}

源码免费下载地址:http://dl.vmall.com/c0lmx5394j

swfupload控件使用指南:http://dl.vmall.com/c0s0bbqp5i

[Pulgin] 利用swfupload实现java文件批量上传的更多相关文章

  1. SWFUpload无刷新文件批量上传

    一.首先将SWFUpload所有文件加入项目中,如图

  2. jquery文件批量上传控件Uploadify3.2(java springMVC)

    人比較懒  有用为主 不怎么排版了 先放上Uploadify的官网链接:http://www.uploadify.com/  -->里面能够看到PHP的演示样例,属性说明,以及控件下载地址.分f ...

  3. b/s利用webuploader实现超大文件分片上传、断点续传

    本人在2010年时使用swfupload为核心进行文件的批量上传的解决方案.见文章:WEB版一次选择多个文件进行批量上传(swfupload)的解决方案. 本人在2013年时使用plupload为核心 ...

  4. 前端利用webuploader实现超大文件分片上传、断点续传

    本人在2010年时使用swfupload为核心进行文件的批量上传的解决方案.见文章:WEB版一次选择多个文件进行批量上传(swfupload)的解决方案. 本人在2013年时使用plupload为核心 ...

  5. 文件批量上传的工具,要实现暂停继续、断点续传等功能(使用QtNetwork和QHttpMultiPart,和定时器检查超时)

    最近在做一个文件批量上传的工具,要实现暂停继续.断点续传等功能.利用Qt自带的QtNetwork模块,完成这些需求并没有费多少周章,主要思路就是将文件分块,然后用while循环依次传输.具体实现代码比 ...

  6. 文件批量上传-统一附件管理器-在线预览文件(有互联网和没有两种)--SNF快速开发平台3.0

    实际上在SNF里使用附件管理是非常简单的事情,一句代码就可以搞定.但我也要在这里记录一下统一附件管理器能满足的需求. 通用的附件管理,不要重复开发,调用尽量简洁. 批量文件上传,并对每个文件大小限制, ...

  7. 使用WebUploader实现文件批量上传,进度条显示功能

    知识点:利用WebUploader,实现文件批量上传,并且实时显示文件的上传进度 参考官方文档:http://fex.baidu.com/webuploader/ (1)引入三个资源 JS,CSS,S ...

  8. SpringMVC+Ajax实现文件批量上传和下载功能实例代码

    需求: 文件批量上传,支持断点续传. 文件批量下载,支持断点续传. 使用JS能够实现批量下载,能够提供接口从指定url中下载文件并保存在本地指定路径中. 服务器不需要打包. 支持大文件断点下载.比如下 ...

  9. 带进度条的文件批量上传插件uploadify

    有时项目中需要一个文件批量上传功能时,个人认为uploadify是快速简便的解决方案. 先上效果图: 一. 下载uploadify 从官网下载uploadify的Flash版本(Flash版本免费,另 ...

随机推荐

  1. 初次尝试PHP——一个简单的对数据库操作的增删改查例子

    第一次学习PHP,很多人说PHP是最好的语言,学习了一点点,还不敢说这样的话,不过确实蛮好用的. 做了一个简单的对数据库的增删改查的操作,主要是将四种操作写成了独立的函数,之后直接调用函数.以下是代码 ...

  2. SSIS SQL Server配置自动作业

    目录: 一. 用SSMS配置作业,自助调度: 二.用SSMS调SSIS包: 一. 用SSMS配置作业,自助调度: 为验证数据,先创建一个表: CREATE TABLE test_table (id I ...

  3. 1、Scala安装与基础

    1.scala与java 2.安装 3.scala编译器 4.变量声明 5.数据类型 6.操作符 7.函数调用 8.apply函数 1.scala与java scala基于java虚拟机,所有scal ...

  4. apicloud常用分享方法

    app中经常会有分享的功能,不管是分享商品还是文字还是图片或者是发送给微信好友扣扣好友,一下做一总结. 分享的样式(分享所有的样式模块):MNActionButton. 在apicloud 中添加这个 ...

  5. vue 登录验证码

    vue 登录验证码 最近在开发pc端项目,配合elementui使用 createCode() { var code = ""; var codeLength = 4; //验证码 ...

  6. spring-boot启动自动执行sql文件失效 解决办法

    在springboot1.5及以前的版本,要执行sql文件只需在applicaion文件里指定sql文件的位置即可.但是到了springboot2.x版本, 如果只是这样做的话springboot不会 ...

  7. HDU 4405 Aeroplane chess(概率dp,数学期望)

    题目 http://kicd.blog.163.com/blog/static/126961911200910168335852/ 根据里面的例子,就可以很简单的写出来了,虽然我现在还是不是很理解为什 ...

  8. 洛谷P1339 [USACO09OCT]热浪Heat Wave

    思路:裸SPFA过一遍(建议使用邻接链表存储),无向图,无向图,无向图,重要的事情要说三遍!!!蜜汁RE是什么鬼????第九个点数组开到20K,第十个点数组开到30K才AC.或许我代码写的有bug?( ...

  9. openldap+openssh+jumpserver实现跳板机监控系统

    首先感谢 http://www.jumpserver.org/ 提供的优秀跳板机系统. 我们把跳板机系统经过二次开发主要是 弃用角色功能使用ldap自动登录. 添加登录后临时认证. 上传下载我们自己在 ...

  10. vue采坑一:全局API

    Vue.set Vue.set( target, key, value ),target不能是 Vue 实例,或者 Vue 实例的根数据对象,因为源码中做了如下判断: var ob = (target ...