背景说明
今天因为工作需要,写一个Excel上传下载的.Net MVC工程的Demo。因为自己是个新手,再编写的过程中百度无数次,遇到很多低级错误。最终完成后,发现在.Net MVC中实现文件上传和下载都非常简单。
首先,在VS中创建一个.Net MVC工程,工程中默认带有了一套MVC的样例代码。因为只是写Demo,我就直接在这个基础上进行了小改动以实现自己需要的效果。
我新写了一个ImportExport.cshtml,用于展示一个表格数据。Refresh按钮用来刷新表格数据。Export按钮用于把当前页面显示的内容导出到Excel。Import按钮在用户选择了Excel文件后,把内容显示在界面上。效果如下图:
ImportExport.cshtml页面
下面是View页面,主要是一个显示数据的表格加上几个实现相关功能的按钮。
@{ ViewBag.Title = "Import Export Demo"; Layout = "~/Views/Shared/_Layout.cshtml"; } <h2>Import Export Demo</h2> <div class="row"> <table> <thead> <tr> <th>Name</th> <th>Age</th> <th>Gender</th> <th>English Score</th> <th>Math Score</th> <th>Average Score</th> </tr> </thead> <tbody> @foreach (Student s in ViewBag.students) { <tr> <td>@s.Name</td> <td>@s.Age.ToString() </td> <td>@s.Gender.ToString()</td> <td>@s.EnglishScore.ToString()</td> <td>@s.MathScore.ToString()</td> <td>@s.AverageScore.ToString()</td> </tr> } </tbody> </table> </div> <div class="row" style="padding: 10px 0 0 0;"> @using (Html.BeginForm("Import", "Home", FormMethod.Post, new { enctype = "multipart/form-data" })) { @Html.ActionLink("Refresh", "Refresh", "Home", null, new { @class = "btn btn-default col-sm-1" }) @Html.ActionLink("Export", "Export", "Home", null, new { @class = "btn btn-default col-sm-1" }) <input type="file" class="col-sm-2" name="file" /> <input type="submit" value="Import" class="btn btn-default col-sm-1" /> <span style="color:red;">@ViewBag.Message</span> } </div>
文件下载
1) 页面上只需要一个对该Comtroller的ActionName发起请求的链接即可
2) HomeController.Export()
注意Export()方法返回的是一个FileResult。我写了一个ImportExportTool.Export()方法用于将Student集合数据写到Excel中,Excel是存储在内容中而非文件中,所以返回了MemoryStream。最后把Stream的内容以及文件的ContentType和名字传给File()方法返回即可。
public FileResult Export() { MemoryStream stream = ImportExportTool.Export(ImportExportTool.Students); return File(stream.ToArray(), "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "EPPlusDemo.xlsx"); }
文件上传
1) 上传Form代码如下(非常简单,Form指向Home/Import,然后包含一个文件选择器和提交按钮):
@using (Html.BeginForm("Import", "Home", FormMethod.Post, new { enctype = "multipart/form-data" })) { <input type="file" class="col-sm-2" name="file" /> <input type="submit" value="Import" class="btn btn-default col-sm-1" /> <span style="color:red;">@ViewBag.Message</span> }
2) HomeController.Import()
Import()方法接收传过来的文件,经过ImportExportTool.Import()方法处理后解析成Student实体类的集合,然后交给ImportExport.cshtml页面来显示。
public ActionResult Import(HttpPostedFileBase file) { if (file == null) { ViewBag.Message = "Please select a file!"; } else { ICollection<Student> students = ImportExportTool.Import(file.InputStream); ImportExportTool.Students = students; } ViewBag.students = ImportExportTool.Students; return View("ImportExport"); }
我这个Demo中有很多验证没有做,但是你有没有感觉特别的简单?
http://www.alanzeng.cn/2016/01/net-mvc-file-upload-download/