javascript - 下载文件“发送带有下载名称的文件”

Question

我有一个 Angular 6 应用程序，我想从我的 .NET Core API 下载生成的 PDF。

每个调用似乎都是有效的，但我不确定如何下载/打开文件。

Microsoft.AspNetCore.Mvc.Infrastructure.FileContentResultExecutor：信息：执行 Microsoft.AspNetCore.Mvc.FileContentResult，发送下载名称为“test.pdf”的文件...

ReportingAPI ：

public IActionResult CreateReport()
{
  XtraReport report = m_ReportingManager.GetReport();

  MemoryStream ms = new MemoryStream();
  report.ExportToPdf(ms);

  HttpContext.Response.ContentType = "application/pdf";
  FileContentResult result = new FileContentResult(ms.GetBuffer(), "application/pdf")
  {
    FileDownloadName = "test.pdf"
  };

  return result;
}

在我的 Angular 组件中，我有 2 次调用服务（1 次来自 SO，1 次来自我自己）

public getReport1() {
    this._reportViewerService.getReport()
      .subscribe(blob => {
        var link = document.createElement('a');
        link.href = window.URL.createObjectURL(blob);
        link.download = "test.pdf";
        link.click();
      }, error => { console.log(error) });
  }

  public getReport2() {   
    this._reportViewerService.getReport().subscribe(
      (result: any) => window.open("http://localhost:44302/Reporting/test.pdf", "_blank"),
      (error: any) => this._loggerService.logError(error),
      () => this.loading = false
    );
  }

我的服务看起来像这样：

  public getReport(definitionKey: string, reportParameters: ReportParameter[]): Observable<any> {
    const parameters = {
      key: definitionKey,
      reportParameters: reportParameters
    };

    return this._http.post<any>(this.baseUrl + 'CreateReport', parameters);
  }

标签： javascriptangularasp.net-core.net-corerxjs

Answer 1

您可以使用文件保护程序包来处理文件下载。

https://www.npmjs.com/package/file-saver

我在我的应用程序中这样做了，希望你能适应你的应用程序：

downloadFile(data: Response){
  let blob = new Blob([data], { type: 'application/pdf' });
  let url= window.URL.createObjectURL(blob);
  console.log(url);
  window.open(url);
}

getPdf() {
   const options: {
        headers?: HttpHeaders,
        observe?: 'body',
        params?: HttpParams,
        reportProgress?: boolean,
        responseType: 'blob',
        withCredentials?: boolean
    } = {
        headers: null,
        params: null,
        responseType: 'blob'
    };

this.http.get(`your api endpoint`, options)
  .subscribe(blob => {
    saveAs(blob, 'file.pdf');
  });
 }