程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> C# >> C#入門知識 >> C#實現文件上傳以及多文件上傳功能

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

編輯:C#入門知識

C#實現文件上傳以及多文件上傳功能。本站提示廣大學習愛好者:(C#實現文件上傳以及多文件上傳功能)文章只能為提供參考,不一定能成為您想要的結果。以下是C#實現文件上傳以及多文件上傳功能正文


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

作者:陳逸子風

這篇文章主要介紹了C#實現文件上傳以及多文件上傳功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下

一、前端搭建

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在該控制器裡編寫如下代碼 (如果是用的aspx頁面那麼把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 裡設置的文件上傳最大值一樣(不能大於這個值)

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

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

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved