首页 > 代码库 > 文件上传之——用SWF插件实现文件异步上传
文件上传之——用SWF插件实现文件异步上传
之前提高过几篇文件上传，那些都不错。今天小编带领大家体会一种新的上传方法，及使用Flash插件实现文件上传。
使用Flash的好处就是可以解决浏览器兼容性问题。之前我写的一个快捷复制功能也是利用的Flash。
最近一直在用MVC，所以还是以MVC举例；先来张效果图：
UploadIndex2.cshtml代码：
@{ Layout = null;}<!DOCTYPE html><html><head> <meta name="viewport" content="width=device-width" /> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <title>上传</title> <script src=http://www.mamicode.com/"~/SWFUpload/swfupload.js" type="text/javascript"></script> <script src=http://www.mamicode.com/"~/SWFUpload/handlers.js" type="text/javascript"></script> <script src=http://www.mamicode.com/"~/Scripts/jquery-1.8.2.min.js"></script> <script type="text/javascript"> var swfu; window.onload = function () { swfu = new SWFUpload({ // Backend Settings upload_url: "@Url.Action("HandlerUpload2","Home")",//上传路径 post_params: { "ASPSESSID": "<@Session.SessionID>" }, // File Upload Settings file_size_limit: "5 MB", file_types: "*.jpg;*.gif", file_types_description: "JPG Images", file_upload_limit: 0, // Zero means unlimited // Event Handler Settings - these functions as defined in Handlers.js // The handlers are not part of SWFUpload but are part of my website and control how // my website reacts to the SWFUpload events. swfupload_preload_handler: preLoad, swfupload_load_failed_handler: loadFailed, file_queue_error_handler: fileQueueError, file_dialog_complete_handler: fileDialogComplete, upload_progress_handler: uploadProgress, upload_error_handler: uploadError, upload_success_handler: showData, upload_complete_handler: uploadComplete, // Button settings button_image_url: "/SWFUpload/images/XPButtonNoText_160x22.png",//设置按钮图片，注意要是连续的四张 button_placeholder_id: "spanButtonPlaceholder",//设置按钮id button_width: 160, button_height: 22, button_text: ‘<span class="button">请选择上传图片 <span class="buttonSmall">(5 MB Max)</span></span>‘, button_text_style: ‘.button { font-family: Helvetica, Arial, sans-serif; font-size: 14pt; } .buttonSmall { font-size: 10pt; }‘, button_text_top_padding: 1, button_text_left_padding: 5, // Flash Settings flash_url: "/SWFUpload/swfupload.swf", // Relative to this file flash9_url: "/SWFUpload/swfupload_FP9.swf", // Relative to this file custom_settings: { upload_target: "divFileProgressContainer" }, // Debug Settings debug: false }); } //上传成功以后执行该方法. function showData(file, serverData) { $("#imgSrc").attr("src", serverData); } </script></head><body> <form id="form1"> <div id="content"> <div id="swfu_container" style="margin: 0px 10px;"> <div> <span id="spanButtonPlaceholder"></span> <!--注意：这个ID要和上面的一致--> </div> <img id="imgSrc" /><!---在这里显示上传的图片，这个插件采用的为异步上传--> </div> </div> </form></body></html>
后端代码：
public ActionResult UploadIndex2() { return View(); } [HttpPost] public ActionResult HandlerUpload2() { HttpPostedFileBase file = Request.Files["Filedata"];//获取文件数据. string fileName = Path.GetFileName(file.FileName);//获取文件名. string fileExt = Path.GetExtension(fileName); //获取文件类型 string fullDir = ""; if (fileExt == ".jpg") { string dir = "/UploadImage/" + DateTime.Now.Year + "-" + DateTime.Now.Month + "-" + DateTime.Now.Day + "/"; Directory.CreateDirectory(Path.GetDirectoryName(Server.MapPath(dir)));//如果没有文件目录，创建. fullDir = dir + OnLineBooks.App.Common.WebCommon.GetStreamMD5(file.InputStream) + fileExt;//构建了一个完整路径，并且以文件流的MD5值作为文件的名称,解决了文件名称重名问题。 file.SaveAs(Server.MapPath(fullDir));//文件保存 Response.Write(fullDir); } return Content(fullDir);//返回图片路径 }
SWFUpload文件下载链接：http://pan.baidu.com/s/1c2xIf5Y 密码：wphd
文件上传之——用SWF插件实现文件异步上传
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。