Struts2使用FlashFileUpload.swf实现批量文件上传

本文介绍如何在Struts2中利用FlashFileUpload实现批量文件上传,并解决了使用该插件时的Session丢失问题。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

[color=gray]今天晚上头有些痛,写篇文章,全当休息下吧。[/color]

讲两点:一是如何在Struts2中使用FlashFileUpload这个flash的上传插件;二是在使用flash上传插件时如何解决Session问题。
[b]
先说第一点,如何在Struts2中使用FlashFileUpload这个flash的上传插件。[/b]

以前做.net时,用过一个FlashFileUpload.swf批量文件上传工具,很帅很简单。
网址:[url]http://www.codeproject.com/KB/aspnet/FlashUpload.aspx[/url]
因为这个用Flex写的客户端插件公开源码,而且实现的的相当完美,在asp.net中用起来,就是一两行代码的事,所以非常喜欢。

最近想在Struts2中实现批量上传(使用html的file标签时,一次只能选一个文件,我是想一下可以选多个文件),结果找了半天,大都是swf+ajax的,用起来太复杂了,代码也很繁多,实在没耐心了。
就想起FlashFileUpload来了,结果发现不知道怎么用,官网上只给出了C#的例子,上网找了半天也没找到在Struts2中用的例子,甚至jsp的例子也没找到,最后自己研究出来了,在这里公开一下,希望对大家有所帮助。

大家从官网上下载了压缩包解压后,会找到Upload.cs,从代码中可以看到HttpContext对象可以直接把文件对象分离出来,想对上传的临时文件进行转存时,也很方便:
            for(int j = 0; j < context.Request.Files.Count; j++)
{
// get the current file
HttpPostedFile uploadFile = context.Request.Files[j];
// if there was a file uploded
if (uploadFile.ContentLength > 0)
{
// save the file to the upload directory

//use this if testing from a classic style upload, ie.

// <form action="Upload.axd" method="post" enctype="multipart/form-data">
// <input type="file" name="fileUpload" />
// <input type="submit" value="Upload" />
//</form>

// this is because flash sends just the filename, where the above
//will send the file path, ie. c:\My Pictures\test1.jpg
//you can use Test.thm to test this page.
//string filename = uploadFile.FileName.Substring(uploadFile.FileName.LastIndexOf("\\"));
//uploadFile.SaveAs(string.Format("{0}{1}{2}", tempFile, "Upload\\", filename));

// use this if using flash to upload
uploadFile.SaveAs(Path.Combine(uploadPath, uploadFile.FileName));


但是到了Struts2中,文件上传使用的是fileUpload拦截器实现文件对象的注入,注入时需要明确file对象的name,如:
<@s.file name="file" label="选择上传文件" />
(使用FreeMarker模板)
后台对应的Action中,需要定义对应的【private File file;】属性及其set方法,这样fileUpload拦截器才能正确的将file对象注入(设置)到Action中。当然多文件上传时,需要使用如【private List<File> file;】样的属性。

现在问题来了,当使用FlashFileUpload这个flash的客户端上传组件时,我们无法得知或声明文件对象的name值,我们也没有办法象在.net中,使用HttpContext拿到文件列表。
我就是在这里卡壳了,后来终于想出了个办法来获知其name了,就是伟大的Debug,通过在fileUpload拦截器中设置断点,或是在自己的Action方法中加上取Request对象的语句,通过断点查看Request中存放的对象,就能找到FlashFileUpload组件中file对象对应的name了,那就是:[b]Filedata[/b],我们可以在Action中定义Filedata属性及其set方法,fileUpload拦截器就可以正确的将FlashFileUpload组件提交上来的文件对象设到Filedata里了。
代码示例:
	/** 文件对象 */
private List<File> Filedata;

/** 文件名 */
private List<String> FiledataFileName;

/** 文件内容类型 */
private List<String> FiledataContentType;

/**
* @return the filedata
*/
public List<File> getFiledata() {
return Filedata;
}

/**
* @param filedata the filedata to set
*/
public void setFiledata(List<File> filedata) {
Filedata = filedata;
}

/**
* @return the filedataFileName
*/
public List<String> getFiledataFileName() {
return FiledataFileName;
}

/**
* @param filedataFileName the filedataFileName to set
*/
public void setFiledataFileName(List<String> filedataFileName) {
FiledataFileName = filedataFileName;
}

/**
* @return the filedataContentType
*/
public List<String> getFiledataContentType() {
return FiledataContentType;
}

/**
* @param filedataContentType the filedataContentType to set
*/
public void setFiledataContentType(List<String> filedataContentType) {
FiledataContentType = filedataContentType;
}



其他转存的代码就与Struts2中多文件上传的代码一模一样了。至此,我们就可以用最少的代码,来实现非常完美的批量上传了,效果相当不错。因为公开源码,所以如果你愿意,可以把FlashFileUpload这个flex做的组件改的更好看,或增加点自己的代码,我抓个粗略的效果图:

[img]/upload/attachment/96702/ae11fae7-d11f-36e7-9498-99913c57e12e.gif[/img]

[b]下面说一下第二点:使用flash上传插件时如何解决Session问题[/b]
在使用Flash上传文件时,存在一个Session丢失的问题。我们做文件上传时,一般都需要用户登录后,才允许上传,但是我发现在使用了Flash上传插件后,一上传Session就丢了,也就是说,在后台处理中,从Session中是取不到判断用户是否登录的标识的,原因是通过Flash上传时发起了一个独立于浏览器之外的请求,在后台程序中是无法通过Cookie取到对应的sessionId的,也就无法判断出用户是否登录了。
解决之法就是在jsp或ftl文件中定义flash上传组件的代码时,把sessionId顺便登记上,这样,通过【url;jsessionid=】的形式,可以把sessionId通过URL传到后台,就可以使Session不丢失了。
示例代码(FreeMarker):
            <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"
width="100%" height="100%" id="file" align="middle">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="/flash/FlashFileUpload.swf?ver=2009041702" />
<param name="quality" value="high" />
<param name="wmode" value="transparent">
<param name="FlashVars" value='fileTypeDescription=JPG格式图片&fileTypes=*.jpg;*.jpeg&fileSizeLimit=3000000&totalUploadSize=10240000&uploadPage=/performMultiuploadForDemo;jsessionid=${session.id}?username=${username}'>
<embed src="/flash/FlashFileUpload.swf?ver=2009041702" FlashVars='fileTypeDescription=JPG格式图片&fileTypes=*.jpg;*.jpeg&fileSizeLimit=3000000&totalUploadSize=10240000&uploadPage=/performMultiuploadForDemo;jsessionid=${session.id}?username=${username}'
quality="high" wmode="transparent" width="100%" height="100%" name="file"
align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>>


好了,写完收工。
<script language="JavaScript" type="text/javascript"> 02.function challs_flash_update(){ //Flash 初始化函数 03.var a={}; 04.//定义变量为Object 类型 05. 06.a.FormName = "Filedata"; 07.//设置Form表单的文本域的Name属性 08. 09.a.url="update.asp"; 10.//设置上传接收文件地址 11. 12.a.parameter="bs=tyi&id=50"; 13.//设置提交参数,以GET形式提交 14. 15.a.typefile=["Images (*.gif,*.png,*.jpg)","*.gif;*.png;*.jpg"]; 16.//设置可以上传文件 数组类型 17.//"Images (*.gif,*.png,*.jpg)"为用户选择要上载的文件时可以看到的描述字符串, 18.//"*.gif;*.png;*.jpg"为文件扩展名列表,其中列出用户选择要上载的文件时可以看到的 Windows 文件格式,以分号相隔 19. 20.a.UpSize=0.5; 21.//可限制传输文件总容量,0或负数为不限制,单位MB 22. 23.a.fileNum=4; 24.//可限制待传文件的数量,0或负数为不限制 25. 26.a.size=100; 27.//上传文件限制大小,单位MB,可以填写小数类型 28. 29.a.FormID=['select','select2']; 30.//设置每次上传时将注册了ID的表单数据以POST形式发送到服务器 31.//需要设置的FORM表单中checkbox,text,textarea,radio,select项目的ID值 32.//参数为数组类型,注意使用此参数必须有 challs_flash_FormData() 函数支持 33. 34.a.CompleteClose=true; 35.//设置为true时,上传完成的条目,将也可以取消删除条目,这样参数 UpSize 将失效, 默认为false 36. 37.return a ; 38.//返回Object 39.} 40. 41.function challs_flash_onStart(a){ //每个文件开始上传时调用的函数,并传入一个Object类型变量,包括刚上传文件的大小,名称,文件类型 42.var name=a.fileName //获取上传文件名 43.var size=a.fileSize //获取上传文件大小,单位字节 44.var type=a.fileType //获取上传文件类型,在 Windows 上,此属性是文件扩展名。 在 Macintosh 上,此属性是由四个字符组成的文件类型 45. 46.} 47. 48.function challs_flash_onComplete(a){ //每个文件上传完成时调用的函数,并传入一个Object类型变量,包括刚上传文件的大小,名称,上传所用时间,文件类型 49.var name=a.fileName //获取上传文件名 50.var size=a.fileSize //获取上传文件大小,单位字节 51.var time=a.updateTime //获取上传所用时间 单位毫秒 52.var type=a.fileType //获取上传文件类型,在 Windows 上,此属性是文件扩展名。 在 Macintosh 上,此属性是由四个字符组成的文件类型 53. 54.} 55. 56.function challs_flash_onCompleteData(a){ //获取服务器反馈信息,参数 a 字符类型,包含了服务器返回的文本信息 57. 58.var Data = a; //获取服务器反馈信息 59. 60.} 61. 62.function challs_flash_onCompleteAll(a){ //上传文件列表全部上传完毕事件,参数 a 数值类型,返回上传失败的数量 63. 64.var Num = a; //获取上传失败数量 65. 66.//文件列表已经全部上传完毕 67. 68.} 69. 70.function challs_flash_FormData(a){ // 使用FormID参数时必要函数 71.try{ 72. 73.return document.getElementById(a).value; 74. 75.}catch(e){ 76. 77.return ''; 78. 79.} 80.} 81.</script> FLASH组件调用代码 view source print? 1.<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="408" height="323" id="update_" align="middle"> 2.<param name="allowFullScreen" value="false" /> 3.<param name="allowScriptAccess" value="always" /> 4.<param name="movie" value="update_.swf" /> 5.<param name="quality" value="high" /> 6.<param name="bgcolor" value="#ffffff" /> 7.<embed src="update_.swf" quality="high" bgcolor="#ffffff" width="408" height="323" name="update_" align="middle" allowScriptAccess="always" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> 8.</object>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值