本文首发《智客工坊-.net mvc和webapi实现文件上传》。

• 搭建项目
• .NET MVC 实现上传
• Web API 实现上传
• 源码

在日常开发中,文件上传是必不可少的功能。如,用户头像,excel文件上传等等。但是,由于开发方式的问题,比如是单体应用还是前后端分离模式,导致实现上有些许的差异。

这里笔者总结了.NET` MVC和Web API 2 中方式实现上传并附上源码,希望能够对您有帮助。

• 打开visual studio 2019,新建一个MVC web 项目。取名upload.netcore.web
• 新建一个MVC控制器,取名TestController
• 新建一个web api 控制器,取名MediaController

建好之后的项目结构如下:

这个是标准的MVC模式的写法,View层提交Form表单方式上传文件。

这里模拟上传文件到项目的根目录的uploads文件夹,可以根据实际情况实现本地存储或者服务器存储。

[HttpPost]
        public async Task PostMedia([FromForm]IFormFile file)
        {
            var formFile = Request.Form.Files.FirstOrDefault();

            if (formFile == null)
            {
                throw new Exception("文件不能为空");
            }

            //文件上传
            var uploads = Path.Combine(_environment.WebRootPath, "uploads");
            using (var fileStream = new FileStream(Path.Combine(uploads, file.FileName), FileMode.Create))
            {
                await file.CopyToAsync(fileStream);
            }

            return Ok(new { success = true });
        }

@{
    ViewData["Title"] = "UploadByRazor";
}

UploadByRazor


    @using (Html.BeginForm("PostMedia", "test", FormMethod.Post,new { enctype = "multipart/form-data" }))
    {
        上传文件
        

        
        

        

        
    }

.net MVC 在用到上传文件控件时，必须添加enctype = "multipart/form-data"属性’

enctype = "multipart/form-data的作用是：设置表单的MIME编码。默认情况,这个编码格式是application/x-www-form-urlencoded,不能用于文件上传;只有使用了application/x-www-form-urlencoded,才能完整把数据提交到controller(后台代码)中。

此种场景一般用于前后端分离的开发模式。后端提供restful风格接口供前端调用(这里有详细:.NET Core 跨平台)

[Route("api/[controller]")]
    [ApiController]
    public class MediaController : ControllerBase
    {
        private IHostingEnvironment _environment;
        public MediaController(IHostingEnvironment env)
        {
            _environment = env;
        }

        /// 

        /// 新增（上传）多媒体文件
        /// 
        /// 
        /// 
        [HttpPost]
        [Consumes("application/json", "multipart/form-data")]
        public async Task PostMedia([FromForm]IFormFile file)
        {
            var formFile = Request.Form.Files.FirstOrDefault();

            if (formFile == null)
            {
                throw new Exception("文件不能为空");
            }

            //文件上传
            var uploads = Path.Combine(_environment.WebRootPath, "uploads");
            using (var fileStream = new FileStream(Path.Combine(uploads, file.FileName), FileMode.Create))
            {
                await file.CopyToAsync(fileStream);
            }

            return Ok(new { success = true });
        }
    }

• postman测试
• ajax 测试

@{
    ViewData["Title"] = "UploadByAjax";
}

UploadByAjax

  talk is cheap,show me the code。

留言可以获取源码。

• 智客工坊-如何用.net mvc和webapi实现文件上传