swfupload上传图片
项目结构 以及插件需要的文件如图所示
前端代码:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>SWFUpload</title> 5 <link href="~/Content/Scripts/tools/swfupload/css/default.css" rel="stylesheet" /> 6 <script src="~/Content/Scripts/tools/jquery-1.11.3.min.js"></script> 7 <script src="~/Content/Scripts/tools/json2.js"></script> 8 <script src="~/Content/Scripts/tools/swfupload/fileprogress.js"></script> 9 <script src="~/Content/Scripts/tools/swfupload/handlers.js"></script> 10 <script src="~/Content/Scripts/tools/swfupload/swfupload.js"></script> 11 <script src="~/Content/Scripts/tools/swfupload/swfupload.queue.js"></script> 12 <script type="text/javascript"> 13 var swfu; 14 window.onload = function () { 15 var settings = { 16 upload_url: "/UpLoad/UpLoading", // 上传地址 17 flash_url: "/Content/Scripts/tools/swfupload/swfupload.swf", // 上传图片flash 18 preserve_relative_urls: false, 19 file_post_name: "fileName", // 上传文件参数名 20 file_size_limit: "100 MB", // 文件大小 21 file_types: "*.jpg;*.png;*.gif;*.bmp;*.doc;*.docx", // 文件格式 22 file_types_description: "All Files", 23 file_upload_limit: "5", 24 file_queue_limit: "0", 25 custom_settings: { 26 progressTarget: "fsUploadProgress", 27 cancelButtonId: "btnCancel" 28 }, 29 debug: true, 30 // Button settings 31 button_image_url: "/Content/Scripts/tools/swfupload/images/TestImageNoText_65x29.png", // Relative to the Flash file 32 button_width: "65", 33 button_height: "29", 34 button_placeholder_id: "spanButtonPlaceHolder", 35 button_text: '<span class="theFont">浏览</span>', 36 button_text_style: ".theFont { font-size: 16; }", 37 button_text_left_padding: 12, 38 button_text_top_padding: 3, 39 40 // The event handler functions are defined in handlers.js 41 file_queued_handler: fileQueued, 42 file_queue_error_handler: fileQueueError, 43 file_dialog_complete_handler: fileDialogComplete, 44 upload_start_handler: uploadStart, 45 upload_progress_handler: uploadProgress, 46 upload_error_handler: uploadError, 47 upload_success_handler: uploadSuccess, 48 upload_complete_handler: uploadComplete, 49 queue_complete_handler: queueComplete // Queue plugin event 50 }; 51 52 swfu = new SWFUpload(settings); 53 }; 54 </script> 55 </head> 56 <body> 57 <div id="content"> 58 <p>点击“浏览”按钮，选择您要上传的文档文件后，系统将自动上传并在完成后提示您。</p> 59 <p>请勿上传包含中文文件名的文件！</p> 60 <div class="fieldset flash" id="fsUploadProgress"> 61 <span class="legend">快速上传</span> 62 </div> 63 <div id="divStatus">0 个文件已上传</div> 64 <div> 65 <span id="spanButtonPlaceHolder"></span> 66 <input id="btnCancel" type="button" value="取消所有上传" onclick="swfu.cancelQueue();" disabled="disabled" style="margin-left: 2px; font-size: 8pt; height: 29px;"/> 67 <input id="btnPase" type="button" value="暂停上传" onclick="swfu.stopQueue();" style="margin-left: 2px; font-size: 8pt; height: 29px;"/> 68 <input id="btnGoon" type="button" value="继续上传" onclick="swfu.startUpload();" style="margin-left: 2px; font-size: 8pt; height: 29px;"/> 69 </div> 70 </div> 71 </body> 72 </html>
后端代码:
1 using System; 2 using System.Web; 3 using System.Web.Mvc; 4 5 namespace Notify.Controller.SwfupLoad 6 { 7 /// <summary> 8 /// 上传图片控制器 9 /// </summary> 10 public class UpLoadController : System.Web.Mvc.Controller 11 { 12 /// <summary> 13 /// 上传图片首页 14 /// </summary> 15 /// <returns>视图</returns> 16 public ActionResult Index() 17 { 18 return View(); 19 } 20 21 /// <summary> 22 /// 上传图片处理 23 /// </summary> 24 /// <param name="fileName">图片流</param> 25 /// <returns>结果</returns> 26 public ActionResult UpLoading(HttpPostedFileBase fileName) 27 { 28 if (fileName != null) 29 { 30 //创建图片新的名称 31 string nameImg = DateTime.Now.ToString("yyyyMMddHHmmssfff"); 32 //获得上传图片的路径 33 string strPath = fileName.FileName; 34 //获得上传图片的类型(后缀名) 35 string type = strPath.Substring(strPath.LastIndexOf(".", StringComparison.Ordinal) + 1).ToLower(); 36 if (ValidateImg(type)) 37 { 38 //拼写数据库保存的相对路径字符串 39 //拼写上传图片的路径 40 var uppath = Server.MapPath("~/Content/Images/UpImgs/"); 41 uppath += nameImg + "." + type; 42 //上传图片 43 fileName.SaveAs(uppath); 44 } 45 } 46 return Content("OK"); 47 } 48 49 /// <summary> 50 /// 验证上传图片类型 51 /// </summary> 52 /// <param name="imgName">图片</param> 53 /// <returns>结果</returns> 54 public bool ValidateImg(string imgName) 55 { 56 string[] imgType = { "gif", "jpg", "png", "bmp" }; 57 58 int i = 0; 59 bool blean = false; 60 61 //判断是否为Image类型文件 62 while (i < imgType.Length) 63 { 64 if (imgName.Equals(imgType[i])) 65 { 66 blean = true; 67 break; 68 } 69 if (i == (imgType.Length - 1)) 70 { 71 break; 72 } 73 i++; 74 } 75 return blean; 76 } 77 } 78 }
使用svn下载
项目地址:http://code.taobao.org/svn/Notify/
