asp.net-mvc-4 - 当 FileResult 函数在 MVC4 中运行时如何显示 'in progress'

Question

我有一个调用此函数的下载按钮:

public FileResult DownloadExport()
{
    string fileName = "example";

    // Activate 'In progress'
    // Call to a function that takes a while
    // Deactivate 'In progress'

    return File(fileName, System.Net.Mime.MediaTypeNames.Application.Octet, Path.GetFileName(fileName));
}

因此，我调用了一个为我生成文件的函数。此功能需要一段时间，我不希望我的用户认为应用程序崩溃了。这就是为什么我想在用户等待时显示“正在进行”。我该如何实现这个？

澄清一下:这个问题不是关于下载的进度，而是关于生成文件的函数的进度。

Answer 1

我最近遇到了同样的问题，我相信我的解决方案(基于 this answer 相关问题)正是您在这个问题中寻找的。基本思想是在生成文件时显示进度微调器(在我的例子中)，在文件生成完成后隐藏进度微调器，然后提供要下载的文件。为了实现这一目标，我需要四件事:

首先， Controller 上的操作需要将文件存储在Session中

[HttpPost]
public ActionResult RunReport(ReportViewModel viewmodel)
{
   // Process that generates the object while will become the file here
   // ...

   using (var stream = new MemoryStream())
   {
      // Convert the object to a memory stream
      report.Generate(stream);  // Use your object here

      string handle = Guid.NewGuid().ToString();
      Session[handle] = stream.ToArray();
      return new JsonResult()
      {
         Data = new
         {
            FileGuid = handle,
            MimeType = "application/pptx",
            FileName = "My File.pptx"
         }
      };
   }
}

Controller 还需要一个新的操作来提供实际的下载文件

public ActionResult Download(string fileGuid, string mimeType, string filename)
{
   if(Session[fileGuid] != null)
   {
       byte[] data = Session[fileGuid] as byte[];
       Session.Remove(fileGuid);  // Cleanup session data
       return File(data, mimeType, filename);
   }
   else
   {
      // Log the error if you want
      return new EmptyResult();
   }
}

接下来，来自显示进度微调器的 View 的 AJAX 调用，调用 RunReport(需要很长时间的操作)，使用它返回的 JSON 数组返回下载文件(这是一个快速操作)，然后再次隐藏微调器。

<script type="text/javascript">
   function RunReport(reportUrl) {
      $.ajax({
         cache: false,
         url: reportUrl,
         type: "POST",
         success: function(response) {
            window.location = "/Report/Download?fileGuid=" + response.FileGuid +
               "&mimeType=" + response.MimeType + "&filename=" + response.FileName;
            $("#progress-spinner").hide();
         }
      });

      $("#progress-spinner").show();
   }
</script>

最后，启动所有内容并生成用于 AJAX 调用的操作链接的链接

<a href="javascript: RunReport('@Url.Action("RunReport", "UserReport", new { ReportId = Model.Id })')">Run Report</a>

我希望这对某人有帮助!