通过AJAX MVC下载Excel文件
我在MVC中有一个大（ish）forms。
我需要能够生成包含该表单子集中的数据的excel文件。
棘手的一点是，这不应该影响表单的其余部分，所以我想通过AJAX来做。 我在SO上遇到了几个似乎有关的问题，但我无法弄清楚答案的意思。
这个似乎最接近我所追求的： asp-net-mvc-downloads-excel – 但我不确定我理解这个反应，现在已经有几年了。 我还看到了另一篇关于使用iframe来处理文件下载的文章（找不到了），但我不知道如何使用MVC。
我的excel文件返回正常，如果我正在做一个完整的post回来但我无法让它在mvc中使用AJAX。
您不能通过AJAX调用直接返回文件以供下载，因此，另一种方法是使用AJAX调用将相关数据发布到您的服务器。 然后，您可以使用服务器端代码来创建Excel文件（我建议使用EPPlus或NPOI，尽管听起来好像您有这个部分工作）。
2016年9月更新
我原来的答案（下面）已经超过3年了，所以我想我会更新，因为我在服务器上通过AJAX下载文件时不再创建文件但是，我已经离开了原始答案，因为它可能仍有一些用途依赖于你的具体要求。
我的MVC应用程序中的一个常见场景是通过具有一些用户配置的报告参数（日期范围，filter等）的网页进行报告。 当用户指定了将它们发布到服务器的参数时，将生成报告（例如，将Excel文件作为输出），然后将生成的文件作为字节数组存储在具有唯一引用的TempData存储桶中。 此引用作为Json结果传递回我的AJAX函数，随后重定向到单独的控制器操作以从TempData提取数据并下载到最终用户浏览器。
为了给出更多细节，假设你有一个MVC View，它有一个绑定到Model类的表单，让我们调用Model ReportVM 。
首先，需要一个控制器动作来接收发布的模型，例如：
public ActionResult PostReportPartial(ReportVM model){ // Validate the Model is correct and contains valid data // Generate your report output based on the model parameters // This can be an Excel, PDF, Word file - whatever you need. // As an example lets assume we've generated an EPPlus ExcelPackage ExcelPackage workbook = new ExcelPackage(); // Do something to populate your workbook // Generate a new unique identifier against which the file can be stored string handle = Guid.NewGuid().ToString(); using(MemoryStream memoryStream = new MemoryStream()){ workbook.SaveAs(memoryStream); memoryStream.Position = 0; TempData[handle] = memoryStream.ToArray(); } // Note we are returning a filename as well as the handle return new JsonResult() { Data = new { FileGuid = handle, FileName = "TestReportOutput.xlsx" } }; }
将我的MVC表单发布到上述控制器并收到响应的AJAX调用如下所示：
$ajax({ cache: false, url: '/Report/PostReportPartial', data: _form.serialize(), success: function (data){ var response = JSON.parse(data); window.location = '/Report/Download?fileGuid=' + response.FileGuid + '&filename=' + response.FileName; } })
用于处理文件下载的控制器操作：
[HttpGet] public virtual ActionResult Download(string fileGuid, string fileName) { if(TempData[fileGuid] != null){ byte[] data = TempData[fileGuid] as byte[]; return File(data, "application/vnd.ms-excel", fileName); } else{ // Problem - Log the error, generate a blank file, // redirect to another controller action - whatever fits with your application return new EmptyResult(); } }
如果需要，可以轻松容纳的另一个更改是将文件的MIME类型作为第三个参数传递，以便一个Controller操作可以正确地提供各种输出文件格式。
这消除了在服务器上创建和存储任何物理文件的任何需要，因此不需要内务处理例程，并且这对于最终用户来说是无缝的。
请注意，使用TempData而不是Session的优点是，一旦读取TempData ，数据就会被清除，因此如果您有大量的文件请求，它在内存使用方面会更有效。 请参阅TempData最佳实践 。
原文答案
您不能通过AJAX调用直接返回文件以供下载，因此，另一种方法是使用AJAX调用将相关数据发布到您的服务器。 然后，您可以使用服务器端代码来创建Excel文件（我建议使用EPPlus或NPOI，尽管听起来好像您有这个部分工作）。
在服务器上创建文件后，将文件路径（或文件名）作为AJAX调用的返回值传回，然后将JavaScript window.location设置为此URL，提示浏览器下载文件。
从最终用户的角度来看，文件下载操作是无缝的，因为它们永远不会离开请求所源自的页面。
下面是一个简单的人为调用实例的例子：
$.ajax({ type: 'POST', url: '/Reports/ExportMyData', data: '{ "dataprop1": "test", "dataprop2" : "test2" }', contentType: 'application/json; charset=utf-8', dataType: 'json', success: function (returnValue) { window.location = '/Reports/Download?file=' + returnValue; } });
- url参数是Controller / Action方法，您的代码将在其中创建Excel文件。
- data参数包含将从表单中提取的json数据。
- returnValue将是您新创建的Excel文件的文件名。
- window.location命令重定向到实际返回文件以供下载的Controller / Action方法。
下载操作的示例控制器方法是：
[HttpGet] public virtual ActionResult Download(string file) { string fullPath = Path.Combine(Server.MapPath("~/MyFiles"), file); return File(fullPath, "application/vnd.ms-excel", file); }
我的2美分 – 您不需要将Excel作为物理文件存储在服务器上 – 而是将其存储在（会话）缓存中。 为Cache变量（存储该excel文件）使用唯一生成的名称 – 这将是（初始）ajax调用的返回。 这样您就不必处理文件访问问题，在不需要时管理（删除）文件等，并且在缓存中使用文件可以更快地检索文件。
我最近能够在MVC中完成此任务（尽管不需要使用AJAX）而不创建物理文件，并且我认为我将共享我的代码：
超级简单的JavaScript函数（datatables.net按钮点击触发此）：
function getWinnersExcel(drawingId) { window.location = "/drawing/drawingwinnersexcel?drawingid=" + drawingId; }
C＃控制器代码：
public FileResult DrawingWinnersExcel(int drawingId) { MemoryStream stream = new MemoryStream(); // cleaned up automatically by MVC List winnerList = DrawingDataAccess.GetWinners(drawingId); // simple entity framework-based data retrieval ExportHelper.GetWinnersAsExcelMemoryStream(stream, winnerList, drawingId); string suggestedFilename = string.Format("Drawing_{0}_Winners.xlsx", drawingId); return File(stream, "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet.main+xml", suggestedFilename); }
在ExportHelper类中，我使用第三方工具（ GemBox.Spreadsheet ）生成Excel文件，它有一个Save to Stream选项。 话虽这么说，有很多方法可以创建可以轻松写入内存流的Excel文件。
public static class ExportHelper { internal static void GetWinnersAsExcelMemoryStream(MemoryStream stream, List winnerList, int drawingId) { ExcelFile ef = new ExcelFile(); // lots of excel worksheet building/formatting code here ... ef.SaveXlsx(stream); stream.Position = 0; // reset for future read } }
在IE，Chrome和Firefox中，浏览器会提示下载文件，并且不会进行实际导航。
我使用了CSL发布的解决方案，但我建议你不要在整个会话期间将文件数据存储在Session中。 通过使用TempData，在下一个请求（即文件的GET请求）之后，将自动删除文件数据。 您还可以在下载操作中管理Session中文件数据的删除。
会话可能消耗大量内存/空间，具体取决于SessionState存储以及会话期间导出的文件数量以及是否有多个用户。
我已经从CSL更新了serer端代码，而不是使用TempData。
public ActionResult PostReportPartial(ReportVM model){ // Validate the Model is correct and contains valid data // Generate your report output based on the model parameters // This can be an Excel, PDF, Word file - whatever you need. // As an example lets assume we've generated an EPPlus ExcelPackage ExcelPackage workbook = new ExcelPackage(); // Do something to populate your workbook // Generate a new unique identifier against which the file can be stored string handle = Guid.NewGuid().ToString() using(MemoryStream memoryStream = new MemoryStream()){ workbook.SaveAs(memoryStream); memoryStream.Position = 0; TempData[handle] = memoryStream.ToArray(); } // Note we are returning a filename as well as the handle return new JsonResult() { Data = new { FileGuid = handle, FileName = "TestReportOutput.xlsx" } }; } [HttpGet] public virtual ActionResult Download(string fileGuid, string fileName) { if(TempData[fileGuid] != null){ byte[] data = TempData[fileGuid] as byte[]; return File(data, "application/vnd.ms-excel", fileName); } else{ // Problem - Log the error, generate a blank file, // redirect to another controller action - whatever fits with your application return new EmptyResult(); } }
首先创建将创建Excel文件的控制器操作
[HttpPost] public JsonResult ExportExcel() { DataTable dt = DataService.GetData(); var fileName = "Excel_" + DateTime.Now.ToString("yyyyMMddHHmm") + ".xls"; //save the file to server temp folder string fullPath = Path.Combine(Server.MapPath("~/temp"), fileName); using (var exportData = new MemoryStream()) { //I don't show the detail how to create the Excel, this is not the point of this article, //I just use the NPOI for Excel handler Utility.WriteDataTableToExcel(dt, ".xls", exportData); FileStream file = new FileStream(fullPath, FileMode.Create, FileAccess.Write); exportData.WriteTo(file); file.Close(); } var errorMessage = "you can return the errors in here!"; //return the Excel file name return Json(new { fileName = fileName, errorMessage = "" }); }
然后创建下载操作
[HttpGet] [DeleteFileAttribute] //Action Filter, it will auto delete the file after download, //I will explain it later public ActionResult Download(string file) { //get the temp folder and file path in server string fullPath = Path.Combine(Server.MapPath("~/temp"), file); //return the file for download, this is an Excel //so I set the file content type to "application/vnd.ms-excel" return File(fullPath, "application/vnd.ms-excel", file); }
如果要在下载后删除文件，请创建此文件
public class DeleteFileAttribute : ActionFilterAttribute { public override void OnResultExecuted(ResultExecutedContext filterContext) { filterContext.HttpContext.Response.Flush(); //convert the current filter context to file and get the file path string filePath = (filterContext.Result as FilePathResult).FileName; //delete the file after download System.IO.File.Delete(filePath); } }
最后ajax调用你的MVC Razor视图
//I use blockUI for loading... $.blockUI({ message: 'Please wait a moment...
' }); $.ajax({ type: "POST", url: '@Url.Action("ExportExcel","YourController")', //call your controller and action contentType: "application/json; charset=utf-8", dataType: "json", }).done(function (data) { //console.log(data.result); $.unblockUI(); //get the file name for download if (data.fileName != "") { //use window.location.href for redirect to download action for download the file window.location.href = "@Url.RouteUrl(new { Controller = "YourController", Action = "Download"})/?file=" + data.fileName; } });
这个post帮我创建了自己的解决方案，我将在这里分享。 我一开始就使用了GET ajax请求而没有出现问题但是它达到了超过请求URL长度的程度，因此我不得不切换到POST。
javascript使用JQuery文件下载插件，包含2个后续调用。 一个POST（发送参数）和一个GET来检索文件。
function download(result) { $.fileDownload(uri + "?guid=" + result, { successCallback: onSuccess.bind(this), failCallback: onFail.bind(this) }); } var uri = BASE_EXPORT_METADATA_URL; var data = createExportationData.call(this); $.ajax({ url: uri, type: 'POST', contentType: 'application/json', data: JSON.stringify(data), success: download.bind(this), fail: onFail.bind(this) });
服务器端
[HttpPost] public string MassExportDocuments(MassExportDocumentsInput input) { // Save query for file download use var guid = Guid.NewGuid(); HttpContext.Current.Cache.Insert(guid.ToString(), input, null, DateTime.Now.AddMinutes(5), Cache.NoSlidingExpiration); return guid.ToString(); } [HttpGet] public async Task MassExportDocuments([FromUri] Guid guid) { //Get params from cache, generate and return var model = (MassExportDocumentsInput)HttpContext.Current.Cache[guid.ToString()]; ..... // Document generation // to determine when file is downloaded HttpContext.Current .Response .SetCookie(new HttpCookie("fileDownload", "true") { Path = "/" }); return FileResult(memoryStream, "documents.zip", "application/zip"); }
CSL的答案是在我正在开发的项目中实现的，但我遇到的问题是在Azure上扩展我的文件下载。 相反，我能够通过一个AJAX调用来做到这一点：
服务器
[HttpPost] public FileResult DownloadInvoice(int id1, int id2) { //necessary to get the filename in the success of the ajax callback HttpContext.Response.Headers.Add("Access-Control-Expose-Headers", "Content-Disposition"); byte[] fileBytes = _service.GetInvoice(id1, id2); string fileName = "Invoice.xlsx"; return File(fileBytes, System.Net.Mime.MediaTypeNames.Application.Octet, fileName); }
CLIENT （ 从ajaxpost下载Handle文件的修改版本）
$("#downloadInvoice").on("click", function() { $("#loaderInvoice").removeClass("d-none"); var xhr = new XMLHttpRequest(); var params = []; xhr.open('POST', "@Html.Raw(Url.Action("DownloadInvoice", "Controller", new { id1 = Model.Id1, id2 = Model.Id2 }))", true); xhr.responseType = 'arraybuffer'; xhr.onload = function () { if (this.status === 200) { var filename = ""; var disposition = xhr.getResponseHeader('Content-Disposition'); if (disposition && disposition.indexOf('attachment') !== -1) { var filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/; var matches = filenameRegex.exec(disposition); if (matches != null && matches[1]) filename = matches[1].replace(/['"]/g, ''); } var type = xhr.getResponseHeader('Content-Type'); var blob = typeof File === 'function' ? new File([this.response], filename, { type: type }) : new Blob([this.response], { type: type }); if (typeof window.navigator.msSaveBlob !== 'undefined') { // IE workaround for "HTML7007: One or more blob URLs were revoked by closing the blob for which they were created. These URLs will no longer resolve as the data backing the URL has been freed." window.navigator.msSaveBlob(blob, filename); } else { var URL = window.URL || window.webkitURL; var downloadUrl = URL.createObjectURL(blob); if (filename) { // use HTML5 a[download] attribute to specify filename var a = document.createElement("a"); // safari doesn't support this yet if (typeof a.download === 'undefined') { window.location = downloadUrl; } else { a.href = downloadUrl; a.download = filename; document.body.appendChild(a); a.click(); } } else { window.location = downloadUrl; } setTimeout(function() { URL.revokeObjectURL(downloadUrl); $("#loaderInvoice").addClass("d-none"); }, 100); // cleanup } } }; xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); xhr.send($.param(params)); });
使用ClosedXML.Excel;
public ActionResult Downloadexcel() { var Emplist = JsonConvert.SerializeObject(dbcontext.Employees.ToList()); DataTable dt11 = (DataTable)JsonConvert.DeserializeObject(Emplist, (typeof(DataTable))); dt11.TableName = "Emptbl"; FileContentResult robj; using (XLWorkbook wb = new XLWorkbook()) { wb.Worksheets.Add(dt11); using (MemoryStream stream = new MemoryStream()) { wb.SaveAs(stream); var bytesdata = File(stream.ToArray(), "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "myFileName.xlsx"); robj = bytesdata; } } return Json(robj, JsonRequestBehavior.AllowGet); }
$就（{
类型：“GET”，
url：“/ Home / Downloadexcel /”，
contentType：“application / json; charset = utf-8”，
数据：null，
成功：函数（Rdata）{
调试器;
var bytes = new Uint8Array（Rdata.FileContents）;
var blob = new Blob（[bytes]，{type：“application / vnd.openxmlformats-officedocument.spreadsheetml.sheet”}）;
var link = document.createElement（'a'）;
link.href = window.URL.createObjectURL（blob）;
link.download =“myFileName.xlsx”;
link.click（）;
}，
错误：函数（错误）{
}
}）;
我正在使用Asp.Net WebForm，我想从服务器端下载文件。 有很多文章，但我找不到基本答案。 现在，我尝试了一种基本的方法并得到它。
那是我的问题。
我必须在运行时动态创建很多输入按钮。 我想添加每个按钮以下载按钮，并给出一个唯一的fileNumber。
我像这样创建每个按钮：
fragment += "";
在提交表格上
public ActionResult ExportXls() { var filePath=""; CommonHelper.WriteXls(filePath, "Text.xls"); } public static void WriteXls(string filePath, string targetFileName) { if (!String.IsNullOrEmpty(filePath)) { HttpResponse response = HttpContext.Current.Response; response.Clear(); response.Charset = "utf-8"; response.ContentType = "text/xls"; response.AddHeader("content-disposition", string.Format("attachment; filename={0}", targetFileName)); response.BinaryWrite(File.ReadAllBytes(filePath)); response.End(); } }