SWFUpload+COS 上传组件+servelet 实现大附件上传
去年的时候整理过例子:
http://blog.csdn.net/misswuyang/article/details/5412375
?
这几天一直在整理一些以前的例子,并且优化了一下,也改写了一些swfupload 的源码,使其适应项目的开发。
?
?
新版本在线预览地址:http://220.178.14.19:8081/cosswfupload
?
1、?需要的Servlet类(上传用)和jar包:
?下面有下载:CosUploaderServlet.rar
?
?
2、?Web.xml配置:
?
<!-- COS大附件上传 限制 500M BEGIN --><servlet><servlet-name>CosUploader</servlet-name><servlet-class>com.ebiz.lv.web.servlet.uploader.CosUploaderServlet</servlet-class><init-param><param-name>fileSizeLimit</param-name><param-value>500</param-value></init-param></servlet><servlet-mapping><servlet-name>CosUploader</servlet-name><url-pattern>/CosUploader.do</url-pattern></servlet-mapping><!-- COS大附件上传 限制 500M END -->?
?
?
3、??页面:?
?
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8" %><%@ include file="../../commons/pages/taglibs.jsp" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>COS swfupload大附件上传</title><link href="${ctx}/styles/style1.css" rel="stylesheet" type="text/css" /><link href="${ctx}/commons/swfupload/style/default.css" rel="stylesheet" type="text/css" /></head><body><div value="save"/> <table width="100%" border="0" align="left" cellpadding="1" cellspacing="1" border="0" cellpadding="1" cellspacing="0"> <tr> <td width="14%"><span id="spanButtonPlaceHolder"></span><img title="添加小于100M的文件作为附件" alt="SWFUpload+COS 下传组件+servelet 实现大附件下传" src="${ctx}/commons/swfupload/style/images/100M.jpg" /></td> <td><span id="btnCancel" onclick="swfu.cancelQueue();" style="font-family:Verdana;color:#005590; cursor:pointer;" >取消上传</span></td> </tr> <tr> <td colspan="2"><div id="divCreateElementsToForm"></div></td> </tr> <tr> <td colspan="2"><div id="fsUploadProgress"></div></td> </tr> </table></td> </tr> <tr> <td nowrap="nowrap" colspan="2"><html-el:submit property="bgsubmit" value=" 提交 " /> <input type="button" name="back" value="返回" onclick="history.back();" /></td> </tr> </table> </html-el:form> </div></div><div id="info"> <div> </div></div><script type="text/javascript" src="${ctx}/commons/scripts/jquery.js"></script> <script type="text/javascript" src="${ctx}/commons/swfupload/swfupload.min.js"></script> <script type="text/javascript" src="${ctx}/commons/swfupload/handlers.min.js"></script> <script type="text/javascript">//<![CDATA[ var addFileName = "上传文档";if ("" != "${oa.map.document_path}") {addFileName = "重新上传";}var swfu;var settings = {ctx : "${ctx}",// 路径entity_id : "${af.map.id}",// 当前数据的iddelete_url : "Cs.do",// ajax删除文件的urldelete_method : "deleteFileForCosSwfupload",// ajax删除文件的method// upload_single_file : true,// 是否上传单个文件,默认上传多个文件flash_url : "${ctx}/commons/swfupload/swfupload.swf",upload_url: "${ctx}/CosUploader.do",post_params: {"uploadTimer" : new Date()},file_size_limit : "100 MB",file_types : "*.*",file_types_description : "All Files",file_upload_limit : 100,file_queue_limit : 0,custom_settings : {progressTarget : "fsUploadProgress",cancelButtonId : "btnCancel",upload_successful : false},// Button settingsbutton_placeholder_id : "spanButtonPlaceHolder",button_text: '<span %></body></html>
?其中需要的swfupload.min 和 handlers.min.js ,下面有下载:swfupload.rar
4、效果图:
选择文件上传:可以选多个文件
?上传完成后:
点击提交后: