如何在角度服务中通过 API 获取 PDF

Cur*_*tis 9 typescript angular

我在服务器上设置了一个基于 Java 的 API。 URL = "ex.com"

它有一个返回 PDF 文件的端点。 URL = "ex.com/pdf"

它需要一个带有参数的 POST 请求,该参数指定正在请求哪个 PDF。 params = { location: "report.pdf"}

我希望能够使用 Angular Http.post observable 来获取 PDF,但它不断抛出 HttpErrorResponse Http failure during parsing for http://ex.com/pdf... Unexpected token % in JSON at position 0 at JSON.parse。但它是一个 PDF,我不希望它被解析为 JSON。

这是我的代码:

params = {location: "report.pdf"};
return this.http.post<Response>("http://ex.com/pdf", params)
    .subscribe(
         data => {
            var file = new Blob([data], {type: 'application/pdf'});
            var fileURL = URL.createObjectURL(file);
            window.open(fileURL);
         }
     );
Run Code Online (Sandbox Code Playgroud)

端点与 PostMan 一起使用。我可以使用“发送和下载”选项成功获取 PDF 文件。所以我只需要弄清楚如何在 Angular 中进行处理。感谢帮助。

Dea*_*ool 13

尝试这样的事情......

首先,您将需要文件保护程序节点包,因此运行 npm install --save file-saver.

然后,尝试这样的事情,我复制粘贴我用于类似的代码

public downloadPDF(): any {
    var mediaType = 'application/pdf';
    this.http.post(this.myUrl, {location: "report.pdf"}, { responseType: 'blob' }).subscribe(
        (response) => {
            var blob = new Blob([response], { type: mediaType });
            saveAs(blob, 'report.pdf');
        },
        e => { throwError(e); }
    );
}
Run Code Online (Sandbox Code Playgroud)

这对我有用,但只是为了保存文件。

让我知道它是否有效!


更新 - ANGULAR7 & FILESAVER V.^2.0.1+


我刚刚从 Angular v.6 和 Filesaver v.<2.0.1 迁移了我的应用程序(不知道它是什么版本,但它是 2.0.1 的以前版本)。
在这个新版本中,您必须将导入更改为:

import { saveAs } from 'file-saver/FileSaver';

import { saveAs } from 'file-saver';

其他一切都像以前的版本一样!