在 C# .net MVC 中使用 ajax 下载文件答案

【问题标题】：Download file with ajax in C# .net MVC在 C# .net MVC 中使用 ajax 下载文件
【发布时间】：2019-02-21 04:18:28
【问题描述】：

我尝试使用以下代码在 C# .net MVC 中使用 ajax 下载文件。由于某种原因，没有工作。有谁知道为什么？

我希望文件将被下载，或者在调用函数 downloadFile 后会弹出一个窗口对话框要求用户选择保存目录

Javascript：

function downloadFile(even) {
    $.ajax({
        url: "/Home/Download",
        type: "POST",
        data: {
            fileName: even.id
        },
        success: function (returnValue) {
            window.location = returnValue;
        },
        error: function (data) {

        }
    });
}

C# 脚本：

[Authorize]
[HttpPost]
public virtual FileResult Download(string fileName)
{
    var file = (fileName.Contains("hl7s") == true ? fileName + ".zip" : fileName + ".txt");
    byte[] fileBytes = System.IO.File.ReadAllBytes(@"c:\temp\"+ file);
    return File(fileBytes, System.Net.Mime.MediaTypeNames.Application.Octet, fileName);
}

【问题讨论】：

您不能使用 AJAX 下载带有FileResult 的文件。如果您想下载它，请使用 [HttpGet] 和 ActionLink 帮助程序指向所需的操作。

标签： c# .net ajax model-view-controller

【解决方案1】：

执行此操作并不是那么简单，但是，有一个脚本可以帮助您。我通常使用FileSaver.js 来执行此操作，它是开源的。 FileSaver 有助于解决浏览器不兼容问题，它也经过了很好的测试。

这是我从当前项目中提取的代码 sn-p。这是纯 javascript，不需要 jQuery 或任何东西。

在此示例中，文件名被硬编码为“my_excel_file.xlsx”，但如果您从 api 公开适当的标头，则可以从 api 获取文件名。我想我已经回答了如何在 SO 中的某个地方处理这个问题。

<html>
  <head>
  <script src="FileSaver.min.js"></script>
  <script>        
    function download() {            
        var xhr = new XMLHttpRequest();
        xhr.open("GET", "http://your.url", true);
        xhr.setRequestHeader("Content-type","application/json");
        xhr.setRequestHeader("Access-Control-Allow-Origin", "*");
        xhr.setRequestHeader("Accept", "application/octet-stream");
        //xhr.setRequestHeader("Authorization", "Bearer ......");
        xhr.onreadystatechange = function() {
            if (xhr.readyState == 4 && xhr.status == 200) {
                var blob = new Blob([xhr.response], {type: "octet/stream"});
                var fileName = "my_excel_file.xlsx";
                saveAs(blob, fileName);
            }
        }
        xhr.responseType = "arraybuffer";
        xhr.send();
    }        
  </script>
</head>
<body>
  <button onclick="javascript:download()">Download Excel File</button>
</body>
</html>

【讨论】：

【解决方案2】：

只需使用 HTML 下载属性即可下载文件

<a href="you file location" download></a>

更多信息请参考this链接

【讨论】：