如何解决mvcfile控件无刷新异步上传操作源码

本篇文章为大家展示了如何解决mvcfile控件无刷新异步上传操作源码，内容简明扼要并且容易理解，绝对能使你眼前一亮，通过这篇文章的详细介绍希望你能有所收获。

上传文件应该是很常见必不可少的一个操作，网上也有很多提供的上传控件。今天遇到一个问题：input控件file无法进行异步无刷新上传。主要分三个部分：上传类的封装，html input控件file处理和后台controller的调用。

上传封装类：

　　此类主要两个功能，一些简单的筛选和文件重命名操作。

文件的筛选包括：

　　文件类型，文件大小

重命名：

　　其中默认为不进行重命名操作，其中重命名默认为时间字符串DateTime.Now.ToString("yyyyMMddHHmmss")

文件地址：

　　可进行自定义。相对地址与绝对地址都可以。

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; }  /// 
  /// 文件上传  /// by wyl 20161019  /// 
  /// 文件上传地址  /// 文件规定大小  /// 文件类型  /// file上传的文件  /// 是否重名名  ///   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

注：因为mvc上传文件input控件file不支持异步无刷新上传，故此用调用跳转到iframe的方式进行上传无刷新操作。

以上页面就是上传控件的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 中

以上就是整个的布局和提交上传文件到后台，并且跳转到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("");  }

注：

1.文件路径，文件保存路径放在了配置文件中，当然你也可以把文件大小，是否重命名都放到配置文件中。

2.返回到view的脚本先弹出提示框；在关闭窗口

3.根据你自己的需要去调用UploadFile的msg（错误提示），FullName （全名称）， FileName文件名称进行操作

4.window.top.close()关闭当前iframe的窗口，针对于兼容性请大家自行处理，我测试的没有问题。

上述内容就是如何解决mvcfile控件无刷新异步上传操作源码，你们学到知识或技能了吗？如果还想学到更多技能或者丰富自己的知识储备，欢迎关注行业资讯频道。