Angular 7 无法使用 c# .net 核心下载文件 api

Question

我有一个 angular 应用程序，其中一个网格的列带有 hyperlink 到 csv 文件。此 csv 位于网络驱动器上。

当用户单击 link 时，他们应该能够将文件保存到他们的计算机（假设所有用户都可以访问）。

我正在使用 file-saver 来 download/save 文件。

这是我的 C# 核心 api 控制器。为了测试，我硬编码了文件名 c:\temp\test.csv。在实际应用中，Angular 将调用带有所需文件（包括完整路径）的 api。

[HttpGet("DownLoadFile/{fileName}")]
public HttpResponseMessage DownLoadFile( string fileName)
        {
            try
            {
                fileName = @"c:\temp\test.csv"; //Hard Coding for testing only. 

                if (!string.IsNullOrEmpty(fileName))
                {

                        HttpResponseMessage response = new HttpResponseMessage(HttpStatusCode.OK);
                        var fileStream = new FileStream(fileName, FileMode.Open);
                        response.Content = new StreamContent(fileStream);
                        response.Content.Headers.ContentType = new MediaTypeHeaderValue("text/csv");
                        response.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment");
                        response.Content.Headers.ContentDisposition.FileName = fileName;
                        return response;
                        //return ResponseMessage(response);
                }
                return new HttpResponseMessage(HttpStatusCode.NotFound);
            }
            catch (Exception ex)
            {

                return new HttpResponseMessage(HttpStatusCode.NotFound);
            }
        }

Angular 服务：

public getFile(filePath:string): Observable<Blob>{
    console.log(filePath);
    let path = 'http://localhost:19090/api/testAPI/DownLoadFile/testfile.csv';
    let options = new RequestOptions({responseType: ResponseContentType.Blob });
    return this._http.get(path, {responseType: 'blob'})
    .pipe(
      catchError(this.handleError));

  }

组件代码： 我的应用程序使用 Kendo 网格。

private downloadFile( dataItem: any):void{
  this._sharedService.getFile(dataItem.test_file)
  .subscribe(
     (data:Blob) => {
       saveAs(data, `Test_1.csv`); // from file-saver library
      },
     (err: any) => {
        console.log(`Unable to save file ${JSON.stringify(err)}`)}
    );
}

此代码确实下载了一个 csv 文件，但它显示为：

   {"version":{"major":1,"minor":1,"build":-1,"revision":-1,"majorRevision":-1,"minorRevision":-1},"content":{"headers":[{"key":"Content-Type","value":["text/csv"]},{"key":"Content-Disposition","value":["attachment; filename=\"c:\temp\blaze.csv\""]}]},"statusCode":200,"reasonPhrase":"OK","headers":[],"requestMessage":null,"isSuccessStatusCode":true}

我做错了什么？任何指针？

这些是我用来解决问题的一些 link：

更新：

感谢这个 link - https://expertcodeblog.wordpress.com/2018/08/13/asp-net-core-angular-how-to-download-file-from-api-controller/

我能够解决我的问题。我更新了我的控制器代码，我可以下载文件了。

Answer 1

根据我的更新，我能够更新我的控制器并解决了我的问题。客户端代码没有变化。

public async Task<IActionResult> DownloadFile(string filename)
        {
            try
            {
                string file = @"c:\temp\test.csv";

                var memory = new MemoryStream();
                using (var stream = new FileStream(file, FileMode.Open))
                {
                    await stream.CopyToAsync(memory);
                }

                memory.Position = 0;
                return File(memory, GetMimeType(file), filename);
            }
            catch (Exception e)
            {
                return BadRequest(e);
            }
        }

Angular 7 无法使用 c# .net 核心下载文件 api

Angular 7 unable to download file with c# .net core api

c#

angular

asp.net-core

filesaver.js