C#實現文件上傳以及多文件上傳功能

2019-10-29 21:10:50

字體：大中小

來源：轉載

供稿：網友

一、前端搭建

1、前端用到js:uploadify(下載地址：http://www.uploadify.com/download/)、layer （下載地址：http://layer.layui.com/），下載之后把它們放在你的項目里列如

2、根據你的需要在你項目適當的位置建立上傳文件的目錄列如（File）

到此前端搭建結束

二、配置文件修改（可選擇跳過此步驟）

1、首先說明下，這個步驟可以跳過，此步驟主要是修改上傳文件大小的限制（.net 默認最大只能上傳4M）如若需要修改請繼續閱讀該步驟。

2、打開web.config 配置文件找到<system.web> 節點，在該節點下面添加如下節點

<httpRuntime targetFramework="4.5"  executionTimeout="500" maxRequestLength="409600" useFullyQualifiedRedirectUrl="false" minFreeThreads="8" minLocalRequestFreeThreads="4" appRequestQueueLimit="100" /><!-- maxRequestLength屬性是上傳文件大小的設置 值是kb大小 maxRequestLength=“1024” 為最大上傳1M -->

三、代碼編寫

1、說明下：我用的是mvc模式所以這里就用mvc的方式編寫（代碼是不變的，開發者可以根據你們的設計模式編寫）

2、建立一個控制器PageBaseController在該控制器里編寫如下代碼?。ㄈ绻怯玫腶spx頁面那么把FileUpdateView方法刪掉，把UploadifyFile 方法的ActionResult改成void 并去掉return null；）　

后端代碼如下

/// <summary>    /// 文件上傳頁面    /// </summary>    /// <returns></returns>    public ActionResult FileUpdateView()    {      return View();    }    /// <summary>    /// 文件處理方法    /// </summary>    /// <param name="filedata"></param>    /// <returns></returns>    public ActionResult UploadifyFile(HttpPostedFileBase filedata)    {      if (filedata == null ||        String.IsNullOrEmpty(filedata.FileName) ||        filedata.ContentLength == 0)      {        return HttpNotFound();      }      string filename = System.IO.Path.GetFileName(filedata.FileName);      string virtualPath = String.Format("~/File/{0}", filename);      string path = Server.MapPath(virtualPath);      // 以下注釋的代碼 都可以獲得文件屬性      // System.Diagnostics.FileVersionInfo info = System.Diagnostics.FileVersionInfo.GetVersionInfo(path);      // FileInfo file = new FileInfo(filedata.FileName);      filedata.SaveAs(path);      return null;    }

注：virtualPath 是我們搭建上傳文件的目錄

3、在視圖（頁面）里引用我們搭建的js：uploadfiy 、layer 路徑

列如:

<script src="~/Scripts/jquery-1.10.2.js"></script><script src="~/Scripts/lib/layer/layer.js"></script><link href="~/Scripts/lib/uploadify/uploadify.css" rel="external nofollow" rel="stylesheet" /><script src="~/Scripts/jquery-1.10.2.min.js"></script><script src="~/Scripts/lib/uploadify/jquery.uploadify.min.js"></script>

注：這里我們用到了jquery

4、前端代碼

<script type="text/javascript">  var uploadifyOnSelectError;  var uploadifyOnUploadError;  var uploadifyOnSelect;  var uploadifyOnUploadSuccess;  uploadifyOnSelectError = function (file, errorCode, errorMsg) {    var msgText = "上傳失敗/n";    switch (errorCode) {      case SWFUpload.QUEUE_ERROR.QUEUE_LIMIT_EXCEEDED:        //this.queueData.errorMsg = "每次最多上傳 " + this.settings.queueSizeLimit + "個文件";        msgText += "每次最多上傳 " + this.settings.queueSizeLimit + "個文件";        break;      case SWFUpload.QUEUE_ERROR.FILE_EXCEEDS_SIZE_LIMIT:        msgText += "文件大小超過限制( " + this.settings.fileSizeLimit + " )";        break;      case SWFUpload.QUEUE_ERROR.ZERO_BYTE_FILE:        msgText += "文件大小為0";        break;      case SWFUpload.QUEUE_ERROR.INVALID_FILETYPE:        msgText += "文件格式不正確，僅限 " + this.settings.fileTypeExts;        break;      default:        msgText += "錯誤代碼：" + errorCode + "/n" + errorMsg;    }    layer.msg(msgText);  };  uploadifyOnUploadError = function (file, errorCode, errorMsg, errorString) {    // 手工取消不彈出提示    if (errorCode == SWFUpload.UPLOAD_ERROR.FILE_CANCELLED      || errorCode == SWFUpload.UPLOAD_ERROR.UPLOAD_STOPPED) {      return;    }    var msgText = "上傳失敗/n";    switch (errorCode) {      case SWFUpload.UPLOAD_ERROR.HTTP_ERROR:        msgText += "HTTP 錯誤/n" + errorMsg;        break;      case SWFUpload.UPLOAD_ERROR.MISSING_UPLOAD_URL:        msgText += "上傳文件丟失，請重新上傳";        break;      case SWFUpload.UPLOAD_ERROR.IO_ERROR:        msgText += "IO錯誤";        break;      case SWFUpload.UPLOAD_ERROR.SECURITY_ERROR:        msgText += "安全性錯誤/n" + errorMsg;        break;      case SWFUpload.UPLOAD_ERROR.UPLOAD_LIMIT_EXCEEDED:        msgText += "每次最多上傳 " + this.settings.uploadLimit + "個";        break;      case SWFUpload.UPLOAD_ERROR.UPLOAD_FAILED:        msgText += errorMsg;        break;      case SWFUpload.UPLOAD_ERROR.SPECIFIED_FILE_ID_NOT_FOUND:        msgText += "找不到指定文件，請重新操作";        break;      case SWFUpload.UPLOAD_ERROR.FILE_VALIDATION_FAILED:        msgText += "參數錯誤";        break;      default:        msgText += "文件:" + file.name + "/n錯誤碼:" + errorCode + "/n"          + errorMsg + "/n" + errorString;    }    layer.msg(msgText);  };  uploadifyOnSelect = function () {  };  uploadifyOnUploadSuccess = function (file, data, response) {    layer.msg(file.name + "/n/n" + response + "/n/n" + data);  };  $(function () {    $("#uploadify").uploadify({      uploader: '/PageBase/UploadifyFun', //處理上傳的方法      swf: '/Scripts/lib/uploadify/uploadify.swf',      width: 80, // 按鈕寬度      height: 60, //按鈕高度      buttonText: "上傳文件",      buttonCursor: 'hand',      fileSizeLimit:20480,      fileobjName: 'Filedata',      fileTypeExts: '*.xlsx;*.docx', //擴展名      fileTypeDesc: "請選擇xslx,docx文件", //文件說明      auto: false, //是否自動上傳      multi: true, //是否一次可以選中多個文件      queueSizeLimit: 5, //允許同時上傳文件的個數      overrideEvents: ['onSelectError', 'onDialogClose'], // 是否要默認提示 要就不配置      onSelect: uploadifyOnSelect,      onSelectError: uploadifyOnSelectError,      onUploadError: uploadifyOnUploadError,      onUploadSuccess: uploadifyOnUploadSuccess    });  });</script><span id="uploadify"></span><div>  <a href="javascript:$('#uploadify').uploadify('upload','*');">上傳</a>  <a href="javascript:$('#uploadify').uploadify('cancel', '*');">取消</a></div>

注：fileSizeLimit 屬性的值最好和我們web.config 里設置的文件上傳最大值一樣（不能大于這個值）

到這里。我們文件上傳就結束了。

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持VEVB武林網。

注：相關教程知識閱讀請移步到c#教程頻道。

上一篇：c#枚舉值增加特性說明(推薦)

下一篇：C#從foreach語句中枚舉元素看數組詳解