如何从 angular 11 中的 byteArray 下载 PDF？

Question

我有字节数组，我想下载没有任何库的 pdf，例如文件保护程序。

service.ts

    return this.http.get(`${this.invoiceUrl}/GenerateInvoice`,
         { responseType: "arraybuffer", observe: "response", params }
    );

component.ts

file(byte) {
    var byteArray = new Uint8Array(byte);
    var a = window.document.createElement('a');

    a.href = window.URL.createObjectURL(new Blob([byteArray], { type: 'application/json' }));
    a.download = "data.txt";

    // Append anchor to body.
    document.body.appendChild(a)
    a.click();


    // Remove anchor from body
    document.body.removeChild(a)
  }

//   download   function
    this.invoiceService.generateInvoice(id).pipe(
      finalize(() => this.loadingFlag = false)
    ).subscribe(
      resp => {
        console.log(resp);
         this.file(resp.body)
}

如果我写这个版本resp是:

如果我写：

 return this.http.get(`${this.invoiceUrl}/GenerateInvoice`,
  { responseType: "arraybuffer", observe: "response", params }
);

响应是

Answer 1

试试这个它对我有用，没有 file-saver:

file(data: any) {
    const blob = new Blob([data], {type: 'application/pdf'});
      let url = URL.createObjectURL(blob);
      const pwa = window.open(url);
      if (!pwa || pwa.closed || typeof pwa.closed === 'undefined') {
        throw error( 'check if your browser block windows');
    }
 }

或者你可以使用这个例子：

file(data: any) {
    const blob = new Blob([data], {type: 'application/pdf'});
      let filename = 'myPdfFile';
      let url= URL.createObjectURL(blob);
      const a = document.createElement('a');
      a.href = url;
      a.download = fileName;
      document.body.appendChild(a);
      a.click();
      document.body.removeChild(a);
      URL.revokeObjectURL(url);
}

第一个示例在您的浏览器上打开pdf，第二个示例下载文件。

Answer 2

解决：服务文件中不需要responseType。

  downloadPDF(str) {
    const linkSource = 'data:application/pdf;base64,' + str;
    const downloadLink = document.createElement("a");
    const fileName = "sample.pdf";

    downloadLink.href = linkSource;
    downloadLink.download = fileName;
    downloadLink.click();
  }

如何从 angular 11 中的 byteArray 下载 PDF？

how to download PDF from byteArray in angular 11?

javascript

pdf

download

angular

angular11