typescript – Angular 2下载文件：损坏结果

发布时间：2020-12-17 08:00:13 所属栏目：安全来源：网络整理

导读：我试图使用Angular 2 / TypeScript和Web API下载文件.我遇到的问题是,在下载文本文件时,该文件是文件,但在尝试下载PDF文件时,例如,它已损坏.下载文件的内容是乱码. 我正在使用的TypeScript如下： downloadFile(fileId: string): ObservableFile { this.appli

我试图使用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)

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!