Question

如何在Angular应用程序中以服务返回的文件名以及原样下载Excel文件？我正在使用file-saver库。这是我的代码：

let blob = new Blob([response],  {type: 'application/vnd.openxmlformat-officedocument.spreadsheetml.sheet;'});
saveAs(blob, 'hello.xlsx');

这是Angular服务的响应：

return this.http.get(`${this.reportsUrl}`, { responseType: 'blob'});

我的后端服务（Spring MVC）的响应。 excelCreatedResource的类型为org.springframework.core.io.Resource：

return ResponseEntity.ok()
                .contentType(MediaType.parseMediaType("application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"))
                .header(HttpHeaders.CONTENT_DISPOSITION,
                "attachment; filename=\"" + excelCreateResource.getFilename() + "\"")
                .body(excelCreateResource);

我不想提供hello.xlsx。相反，我只想下载文件而不更改服务返回的文件名。如果直接从浏览器访问URL，则可以下载Excel文件。

Answer 1

根据您的问题，我认为您需要观察完整的响应并从中获取标题详细信息。在Angular中，您可以使用

let observable$ = this.http.get(`${this.reportsUrl}`, { observe: 'response'});
observable$.subscribe(response => {
  let blobObj = response.body; // this should be your blob object (body of response)
  let headers = response.Headers //This is a disctionary/HashMap were you'll find the content-desposition header

//.....

})

Answer 2

如果excelCreateResource.getFilename();返回文件名，则可以将文件名存储在本地变量中，并通过saveAs()方法传递该变量，例如：

var filename = excelCreateResource.getFilename();
saveAs(blob, filename );

也许它将为您工作。

Answer 3

您可以保存File构造函数而无需指定文件名。文件本身已经包含一个名称。

let blob = new Blob([response], {type: 'application/vnd.openxmlformatofficedocument.spreadsheetml.sheet;'}); saveAs(blob);

或者您必须从响应中获取标头，将文件名保存在变量中，然后将变量传递给saveAs（）函数。

Answer 4

使用库FileSaverJs

prevState.list.filter(x=> x != 3);

在Angular中以原样下载Excel文件

4 个答案: