標籤：summary rip page win cto url web html 布局
前言上傳檔案應該是很常見必不可少的一個操作，網上也有很多提供的上傳控制項。今天遇到一個問題：input控制項file無法進行非同步無重新整理上傳。真真的感到彆扭。所以就嘗試這去處理了一下。
上傳封裝類：using System;using System.Collections.Generic;using System.Linq;using System.Text;using System.Threading.Tasks;using System.IO;using System.Web;namespace CommonHelper{ public class UploadFile : System.Web.UI.Page { public UploadFile() { } //錯誤資訊 public string msg { get; set; } public string FullName { get; set; } //檔案名稱 public string FileName { get; set; } /// <summary> /// 檔案上傳 /// by wyl 20161019 /// </summary> /// <param name="filepath">檔案上傳地址</param> /// <param name="size">檔案規定大小</param> /// <param name="filetype">檔案類型</param> /// <param name="files">file上傳的檔案</param> /// <param name="isrename">是否重名名</param> /// <returns></returns> public bool upload_file(string filepath, int size, string[] filetype, bool isrename = false) { filepath = Server.MapPath(filepath); //檔案夾不存在就建立 if (!Directory.Exists(filepath)) Directory.CreateDirectory(filepath); if (HttpContext.Current.Request.Files.Count == 0) { msg = "檔案上傳失敗"; return false; } msg = "上傳成功"; var file = HttpContext.Current.Request.Files[0]; if (file.ContentLength == 0) { msg = "檔案大小為0"; return false; } if (file.ContentLength > size * 1024) { msg = "檔案超出指定大小"; return false; } var filex = HttpContext.Current.Request.Files[0]; string fileExt = Path.GetExtension(filex.FileName).ToLower(); if (filetype.Count(a => a == fileExt) < 1) { msg = "檔案類型不支援"; return false; } if (isrename) FileName = DateTime.Now.ToString("yyyyMMddHHmmss") + fileExt; FileName = filex.FileName; FullName = Path.Combine(filepath, FileName); file.SaveAs(FullName); return true; } }}
上傳檔案的方法在這也沒有什麼過得的介紹。看代碼注釋應該都好理解。
頁面html<div class="content"><form method="post" target="hidden_frame" enctype="multipart/form-data" action="/CustomFrom/FormDesign/FileUpload" name="form"><input class="m input" name="fileName" type="file"><input class="btn file-input" value="提交..." name="F2" type="submit"><iframe id="hidden_frame" name="F2" style="display: none"><html><head></head><body></body></html></iframe></form></div
以上頁面就是上傳控制項的html定義。有幾點要注意的
1.enctype="multipart/form-data"必須加上，表單中enctype="multipart/form-data"的意思，是設定表單的MIME編碼。預設情況，這個編碼格式是application/x-www-form-urlencoded，不能用於檔案上傳；只有使用了multipart/form-data，才能完整的傳遞檔案資料，進行下面的操作. enctype="multipart/form-data"是上傳位元據; form裡面的input的值以2進位的方式傳過去。
2.form的name 要加上
3.提交按鈕是submit，當然你如果想寫js 設定成button也成。這個沒什麼好說的。
4.iframe 中style="display: none"
以上就是整個的布局和提交上傳檔案到後台，並且跳轉到ifrom中，接下來就是接受調用上面上傳檔案的方法。然後在iframe頁面提示上傳結果，然後把iframe關閉即可。
後台代碼： [HttpPost] public ActionResult FileUpload() { //從設定檔中擷取支援上傳檔案格式 string[] fileType = ConfigurationManager.AppSettings["fileType"].Split(‘|‘); //上傳檔案路徑 string strPath = ConfigurationManager.AppSettings["strPath"]; UploadFile file= new UploadFile(); bool flag = file.upload_file(strPath, 25000, fileType); return Content("<script>window.alert(‘" + file.msg + "‘);window.top.close()</script>"); }
註：檔案路徑，檔案儲存路徑放在了設定檔中，當然你也可以把檔案大小，是否重新命名都放到設定檔中。
mvc中file無重新整理上傳檔案
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
