swfupload组件上传文件
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了swfupload组件上传文件相关的知识，希望对你有一定的参考价值。
前段时间做文件上传用的是H5的一个插件，由于浏览器的兼容性不好，所以又换了一个Flash版本的上传文件插件。不过，由于后续浏览不再支持Flash（略囧），所以，暂时还没有找到能够完美兼容浏览器的上传文件插件。各位网友如果有好的插件，请推荐下。
View代码：
1 <html> 2 <head> 3 <meta name="viewport" content="width=device-width" /> 4 <title>Index</title> 5 <script src="~/Scripts/jquery-1.10.2.min.js"></script> 6 <script src="~/Content/swfupload/swfupload.js"></script> 7 <script src="~/Content/swfupload/handlers.js"></script> 8 <script type="text/javascript"> 9 var swfu; 10 window.onload = function () { 11 swfu = new SWFUpload({ 12 // Backend Settings 13 upload_url: "/UploadFile/UploadFile", 14 post_params : { 15 }, 16 17 // File Upload Settings 18 file_size_limit : "2 MB", 19 file_types : "*.jpg", 20 file_types_description : "JPG Images", 21 file_upload_limit : 0, // Zero means unlimited 22 23 // Event Handler Settings - these functions as defined in Handlers.js 24 // The handlers are not part of SWFUpload but are part of my website and control how 25 // my website reacts to the SWFUpload events. 26 swfupload_preload_handler : preLoad, 27 swfupload_load_failed_handler : loadFailed, 28 file_queue_error_handler : fileQueueError, 29 file_dialog_complete_handler : fileDialogComplete, 30 upload_progress_handler : uploadProgress, 31 upload_error_handler : uploadError, 32 upload_success_handler : uploadSuccess, 33 upload_complete_handler : uploadComplete, 34 35 // Button settings 36 button_image_url: "/Content/swfupload/images/XPButtonNoText_160x22.png", 37 button_placeholder_id : "spanButtonPlaceholder", 38 button_width: 160, 39 button_height: 22, 40 button_text : ‘<span class="button">上传文件<span class="buttonSmall">(2 MB Max)</span></span>‘, 41 button_text_style : ‘.button { font-family: Helvetica, Arial, sans-serif; font-size: 14pt; } .buttonSmall { font-size: 10pt; }‘, 42 button_text_top_padding: 1, 43 button_text_left_padding: 5, 44 45 // Flash Settings 46 flash_url : "/Content/swfupload/swfupload.swf", // Relative to this file 47 flash9_url: "/Content/swfupload/swfupload_FP9.swf", // Relative to this file 48 49 custom_settings : { 50 upload_target : "divFileProgressContainer" 51 }, 52 53 // Debug Settings 54 debug: false 55 }); 56 57 //文件上传成功后,给用户提示信息 58 function uploadSuccess(file, serverData) { 59 var result = serverData.split(‘|‘); 60 if (result[0] == ‘ok‘) { 61 alert(result[1]); 62 } 63 } 64 } 65 66 67 </script> 68 </head> 69 <body> 70 <div id="content"> 71 <div id="swfu_container" style="margin: 0px 10px;"> 72 <div> 73 <span id="spanButtonPlaceholder"></span> 74 </div> 75 <div id="divFileProgressContainer" style="height: 75px;"></div> 76 <div id="thumbnails"></div> 77 </div> 78 </div> 79 </body> 80 </html>
Controller代码;
1 private string uploadPath = ConfigurationManager.AppSettings["UploadFile"];//文件上传路径 2 private string fileFormat = ConfigurationManager.AppSettings["FileFormat"];//允许上传的文件格式 3 4 5 /// <summary> 6 /// 保存上传文件 7 /// </summary 8 /// <returns></returns> 9 public ActionResult UploadFile() 10 { 11 HttpPostedFileBase fileData = Request.Files["Filedata"]; 12 string fileExt = Path.GetExtension(fileData.FileName); 13 14 string[] formatArray = fileFormat.Split(‘|‘); 15 if (!formatArray.Contains(fileExt)) 16 { 17 return Content("no|上传文件格式不正确"); 18 } 19 string saveDirectory = uploadPath + "/UploadFile/";//保存上传文件的文件夹 20 if (!Directory.Exists(saveDirectory)) 21 { 22 Directory.CreateDirectory(saveDirectory); 23 } 24 25 string fileName = Guid.NewGuid().ToString() + fileExt; 26 string savePath = saveDirectory + fileName; 27 fileData.SaveAs(savePath);//上传文件保存 28 29 return Content("ok|文件上传成功"); 30 }
webconfig中的配置
1 <add key="UploadFile" value="E:/swfUploadFileStorage/"/> 2 <add key="FileFormat" value=".bmp|.jpg|.jpeg|.png|.jif"/>
以上是关于swfupload组件上传文件的主要内容，如果未能解决你的问题，请参考以下文章
如何修改swfupload上传组件的样式？从管网上下的demo不太好看我想改成QQ相册一样的上传样式