首页 > 代码库 > mvc中file无刷新上传文件

mvc中file无刷新上传文件

2024-08-17 08:31:04   220人阅读

前言

　　上传文件应该是很常见必不可少的一个操作，网上也有很多提供的上传控件。今天遇到一个问题：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无刷新上传文件


联系
我们