我试图使用Angular 2 / TypeScript和Web API下载文件.我遇到的问题是,在下载文本文件时,该文件是文件,但在尝试下载PDF文件时,例如,它已损坏.下载文件的内容是乱码.
我正在使用的TypeScript如下:
downloadFile(fileId: string): Observable<File> { this.applicationsUrl = `${APIConfig.BaseUrl}/documents/download/${fileId}/`; let headers = new Headers({ 'Content-Type': 'application/json','MyApp-Application' : 'AppName' }); let options = new RequestOptions({ headers: headers }); return this.http.post(this.applicationsUrl,'',options) .map(this.extractContent) .catch(this.handleError); } private extractContent(res: any) { let blob: Blob = new Blob([res._body],{ type: 'application/pdf'}); window['saveAs'](blob,'test.pdf'); }
窗口[‘saveAs’]只是访问JavaScript FileSaver.js函数的一种解决方法.
另外我设置了res:响应res:any所以我可以在JavaScript下访问private _body属性而不会在TypeScript中编译失败.
任何帮助将不胜感激.
从Angular RC5开始,代码应该适合您:
downloadFile(fileId: string): Observable<File> { this.applicationsUrl = `${APIConfig.BaseUrl}/documents/download/${fileId}/`; let headers = new Headers({ 'Content-Type': 'application/json','MyApp-Application' : 'AppName','Accept': 'application/pdf' }); let options = new RequestOptions({ headers: headers,responseType: ResponseContentType.Blob }); return this.http.post(this.applicationsUrl,options) .map(this.extractContent) .catch(this.handleError); } private extractContent(res: Response) { let blob: Blob = res.blob(); window['saveAs'](blob,'test.pdf'); }
我有一个类似的问题,并将Accept-Header设置为application / pdf,responseType为Blob,并通过Response上的相应方法访问blob解决了这个问题:)(我也在使用FileSaver)