背景说明

今天因为工作需要,写一个Excel上传下载的.Net MVC工程的Demo。因为自己是个新手,再编写的过程中百度无数次,遇到很多低级错误。最终完成后,发现在.Net MVC中实现文件上传和下载都非常简单。

首先,在VS中创建一个.Net MVC工程,工程中默认带有了一套MVC的样例代码。因为只是写Demo,我就直接在这个基础上进行了小改动以实现自己需要的效果。

我新写了一个ImportExport.cshtml,用于展示一个表格数据。Refresh按钮用来刷新表格数据。Export按钮用于把当前页面显示的内容导出到Excel。Import按钮在用户选择了Excel文件后,把内容显示在界面上。效果如下图:

2016012802

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中有很多验证没有做,但是你有没有感觉特别的简单?

1 对 “.Net MVC 文件上传和下载”的想法;

发表评论

邮箱地址不会被公开。 必填项已用*标注