前几周做一个web企业项目,用户一定要求要有批量上传功能,而且指明了要和他们的老系统上传文件功能一样(老系统是c/s结构,vb做的)。然后没办法,想来想去只有flash能做到,于是上网找有没有这方面的东西,就找到了这个东东——SWFUpload.
官网地址是:http://swfupload.mammon.se/
由于在官网的里例子示范里面只有php,C#,VB.net和ROR的,然后我上javaeye搜了下,好象也不多,只有一篇,而且也是比较高级的,于是只能自己搞了。
完了之后觉得这个东西的确相当不错,使用感觉很好,我估计我以后做项目可能都要用这玩意了。
代码我自己做了个war包,很简单的一个例子,我在tomcat5.5和java5.0环境下测试通过。
包结构如下:
- index.jsp
- upload.jsp
- js
- +-----example_callbacks.js
- +-----SWFUpload.js
- +-----SWFUpload.swf
index.jsp upload.jsp js +-----example_callbacks.js +-----SWFUpload.js +-----SWFUpload.swf
以上index.jsp就是
文件上传
显示页面,upload.jsp做上传功能。js里面的两个一个是与swf通信的回调函数,一个是本身使用的js文件。
比较重要的一段内容是在index.jsp里面,如下
- var swfu;
- window.onload = function() {
- swfu = new SWFUpload({
- upload_script : "../upload.jsp" , //调用的上传功能
- target : "SWFUploadTarget" ,
- flash_path : "js/SWFUpload.swf" , //flash所在位置
- allowed_filesize : 30720 , // 30 MB
- allowed_filetypes : "*.*" ,
- allowed_filetypes_description : "All files..." ,
- browse_link_innerhtml : "选择" ,
- upload_link_innerhtml : "开始上传" ,
- browse_link_class : "swfuploadbtn browsebtn" ,
- upload_link_class : "swfuploadbtn uploadbtn" ,
- flash_loaded_callback : 'swfu.flashLoaded' ,
- upload_file_queued_callback : "fileQueued" ,
- upload_file_start_callback : 'uploadFileStart' ,
- upload_progress_callback : 'uploadProgress' ,
- upload_file_complete_callback : 'uploadFileComplete' ,
- upload_file_cancel_callback : 'uploadFileCancelled' ,
- upload_queue_complete_callback : 'uploadQueueComplete' ,
- upload_error_callback : 'uploadError' ,
- upload_cancel_callback : 'uploadCancel' ,
- auto_upload : false
- })
- }
var swfu; window.onload = function() { swfu = new SWFUpload({ upload_script : "../upload.jsp", //调用的上传功能 target : "SWFUploadTarget", flash_path : "js/SWFUpload.swf", //flash所在位置 allowed_filesize : 30720, // 30 MB allowed_filetypes : "*.*", allowed_filetypes_description : "All files...", browse_link_innerhtml : "选择", upload_link_innerhtml : "开始上传", browse_link_class : "swfuploadbtn browsebtn", upload_link_class : "swfuploadbtn uploadbtn", flash_loaded_callback : 'swfu.flashLoaded', upload_file_queued_callback : "fileQueued", upload_file_start_callback : 'uploadFileStart', upload_progress_callback : 'uploadProgress', upload_file_complete_callback : 'uploadFileComplete', upload_file_cancel_callback : 'uploadFileCancelled', upload_queue_complete_callback : 'uploadQueueComplete', upload_error_callback : 'uploadError', upload_cancel_callback : 'uploadCancel', auto_upload : false }) }
有一点要提醒,要当心这个upload_script属性,这个值是一个相对地址,
是swf文件相对于上传功能文件的路径。这个很容易搞错
我这个包里upload.jsp就是上传功能,看代码就知道了,很原始的一个
文件上传
。
再就是如果上传过程中是404错误,一般是就是这个upload_script属性设置错误,如果是500错误就是上传文件(upload.jsp)出错。
具体的配置等等就看官网的论坛吧,常见问题基本都在那里了。