下载响应 angular2 发送的文件

Question

我知道这是一个愚蠢的问题，但有人能告诉我如何提示用户下载后端在响应中发送的文件吗？

Answer 1

你有两种可能：

1. 如果后端通过单击链接将文件直接发送到浏览器，则后端应在标头中使用内容类型 application/octet-stream。这会导致浏览器询问用户如何保存/打开文件。

2. 如果您通过 Angular 代码（Http 模块）从后端加载文件，那么您可以使用 filesaver.js 或类似的库。然后你就拥有了完全的控制权，可以自己提示用户。

   npm install file-saver --save
   

   ...和打字：

   npm install @types/file-saver --save-dev
   

   服务中的代码：

   public getFile(path: string):Observable<Blob>{
     let options = new RequestOptions({responseType: ResponseContentType.Blob});
   
     return this.http.get(path, options)
         .map((response: Response) => <Blob>response.blob())              
         .catch(this.handleError);
   }
   

   对于使用 FileSaver.js 将以下导入到您的组件中：

   import * as FileSaver from 'file-saver';
   

   要触发下载，请使用：

   this.api.getFile("file.pdf")
   .subscribe(fileData => FileSaver.saveAs(fileData, "file.pdf"));