WebApi 下载响应作为文件

Question

我的 WebApi 有问题。根据请求，响应返回为 json 或 csv。对于序列化，我使用 NewtonSoft.Json 和我自己的 CsvMediaTypeFormatter。只要我从 Postman 测试它，响应就会按预期工作。

我想强制浏览器保存文件，以防响应为 csv。为此，在我的 CsvMediaTypeFormatter 中，我覆盖了 SetDefaultContentHeaders 方法，如下所示：

public override void SetDefaultContentHeaders(Type type, HttpContentHeaders headers, MediaTypeHeaderValue mediaType)
{
    base.SetDefaultContentHeaders(type, headers, mediaType);

    headers.ContentDisposition = new ContentDispositionHeaderValue("attachment")
                                 {
                                     FileName = "content.csv"
                                 };
}

当我使用 Postman 测试我的 API 时，我看到 csv 内容为 body，header 也显示为 content-disposition: attachment; filename=content.csv。

但是当它从浏览器（我试过 Firefox、Chrome 和 Edge）点击时，没有 "Save file as..." 对话框。但是，开发工具显示正在进行的调用和具有 content-disposition header 值的响应。

我尝试了各种 Content-type 值：text/csv、text/plain、application/octet-stream 或 application/x-unknown，但没有成功。

知道我做错了什么吗？

Answer 1

如果您使用某些 js 框架进行 http 调用，您可能需要手动将内容转储到文件中。以下是 AngularJS 和 Angular2.

的示例

AngularJS:

this.$http(req).success(data => {
    const file = new Blob([data],
        {
            type: "text/csv"
        });

    const a = document.createElement("a");
    a.href = URL.createObjectURL(file);
    a.target = "_blank";
    a.download = `yourfilename.csv`;
    document.body.appendChild(a);
    a.click();
});

角度2+

downloadFile(data: Response){
    const file = new Blob([data],
        {
            type: "text/csv"
        });
    var url= window.URL.createObjectURL(blob);
    window.open(url);
}

How to create and save file to local fileSystem using AngularJS?

WebApi 下载响应作为文件

WebApi download response as file

c#

csv

asp.net-web-api

http-headers

content-negotiation