Angular 在中的“新建”选项卡中打开pdf文件
我正在尝试在Angular 9的新选项卡中实现pdf文件打开。我以blob的形式从api接收文件。但是由于Angular 在中的“新建”选项卡中打开pdf文件,angular,typescript,Angular,Typescript,我正在尝试在Angular 9的新选项卡中实现pdf文件打开。我以blob的形式从api接收文件。但是由于window.URL.createObjectURL(blob)已弃用。我收到此消息未能在“URL”上执行“createObjectURL”:未找到与提供的签名匹配的函数。错误。我知道现在我应该使用MediaStream()来执行他的操作,但我不知道如何使它与blob一起工作 我的代码现在看起来像这样,但缺少主要部分: downloadFile() { console.log('Fi
window.URL.createObjectURL(blob)
已弃用。我收到此消息未能在“URL”上执行“createObjectURL”:未找到与提供的签名匹配的函数。
错误。我知道现在我应该使用MediaStream()
来执行他的操作,但我不知道如何使它与blob一起工作
我的代码现在看起来像这样,但缺少主要部分:
downloadFile() {
console.log('File download started.');
const blob = this.agreementService.getPdfReport(this.agreementNumber);
// Deprecated part
const url = window.URL.createObjectURL(blob);
const link = this.downloadZipLink.nativeElement;
link.href = url;
link.download = 'Agreement.pdf';
link.click();
window.URL.revokeObjectURL(url);
}
agreement.service.ts:
getPdfReport(agreementNumber: string){
this.requestUrl = `${configs.api}v1/reports/${agreementNumber}/Agreement.pdf`;
let headers = new HttpHeaders();
headers = headers.set('Accept', 'application/pdf');
return this.http.get(this.requestUrl, {headers, responseType: 'blob'});
}
getPdfReport(agreementNumber: string) {
this.requestUrl = `${configs.api}v1/reports/${agreementNumber}/Agreement.pdf`;
return this.http.get(this.requestUrl, { responseType: 'blob', observe: 'response'}).pipe(
map((res: any) => {
return new Blob([res.body], { type: 'application/pdf' });
})
);
}
从两个答案中得出我自己的解决方案。如果我做错了什么,请在评论中纠正我 agreement.service.ts:
getPdfReport(agreementNumber: string){
this.requestUrl = `${configs.api}v1/reports/${agreementNumber}/Agreement.pdf`;
let headers = new HttpHeaders();
headers = headers.set('Accept', 'application/pdf');
return this.http.get(this.requestUrl, {headers, responseType: 'blob'});
}
getPdfReport(agreementNumber: string) {
this.requestUrl = `${configs.api}v1/reports/${agreementNumber}/Agreement.pdf`;
return this.http.get(this.requestUrl, { responseType: 'blob', observe: 'response'}).pipe(
map((res: any) => {
return new Blob([res.body], { type: 'application/pdf' });
})
);
}
协议.component.ts:
this.agreementService.getPdfReport(this.agreementNumber).subscribe(res => {
const fileURL = URL.createObjectURL(res);
window.open(fileURL, '_blank');
});