Angular 错误：无法加载PDF文档。（五）

我正在尝试从Web API获取PDF文档，并希望在Angular应用程序中显示。获取“未能加载PDF文档错误”

请按照我的密码：

我的服务

public download_pdf(id: string): Observable<any> {
        let params = new URLSearchParams();
        let headers = new Headers();
        headers.append('x-access-token', this.auth.getCurrentUser().token);
        headers.append('id', id);
        return this.http.get(Api.getUrl(Api.URLS.download_pdf), {
          headers: headers,
          responseType: ResponseContentType.ArrayBuffer,

        }).map(
          response => (<Response>response).blob())
    }

Template.html

  <button>
   <i class="fa fa-save" aria-hidden="true"(click)="downloadFile2(item.id)"></i>
  </button>

结果是：下载test.pdf-->加载pdf文档失败

---

请按照以下步骤解决此问题

第一步。在API中将字节数组转换为base64字符串，如下所示

[HttpGet("Downloadpdf/{SessionKey}")]
        public IActionResult Downloadpdf(string SessionKey)
        {
            Byte[] pdf = null;
            try
            {
                pdf = PDFService.Downloadpdf(SessionKey);//Here you need to modify and get byte array like byte[]
                string pdfBase64 = Convert.ToBase64String(pdf);
                return Ok(pdfBase64);
            }
            catch (Exception ex)
            {
                throw ex;
            }
        }

第二步。在下面添加一个函数，将base64字符串转换为.ts文件中的ArrayBuffer

base64ToArrayBuffer(base64:any):ArrayBuffer {
      var binary_string =  window.atob(base64);
      var len = binary_string.length;
      var bytes = new Uint8Array( len );
      for (var i = 0; i < len; i++)        {
          bytes[i] = binary_string.charCodeAt(i);
      }
      return bytes.buffer;
  }

---

您也可以在Angular 10中使用此选项

服务台

getPdf（）：可观察的{
返回this.http.get（`${this.apirl}Controller/GetPdf`）；
}

组件技术

this.service.getPdf（）.subscribe（（resp）=>{
let response=this.base64ToArrayBuffer（resp）；
let file=new Blob（[response]，{type:'application/pdf'}）；
var fileURL=URL.createObjectURL（文件）；
window.open（fileURL）；
});
}

辅助方法

base64ToArrayBuffer（base64:any）：ArrayBuffer{
var binary_string=window.atob（base64）；
var len=二进制字符串长度；
var字节=新的Uint8Array（len）；
对于（变量i=0；i

您提到的更改对我来说效果很好，但我想了解为什么需要转换为ToBase64String而不是返回字节数组。

base64ToArrayBuffer(base64:any):ArrayBuffer {
      var binary_string =  window.atob(base64);
      var len = binary_string.length;
      var bytes = new Uint8Array( len );
      for (var i = 0; i < len; i++)        {
          bytes[i] = binary_string.charCodeAt(i);
      }
      return bytes.buffer;
  }

let sessionKey: any ="sessiontoken";
      this.pdfService.downloadpdf(sessionKey).subscribe((data: any) => {
        var byteArray = this.base64ToArrayBuffer(data);
        let blob: any = new Blob([byteArray], { type: 'application/octet-stream' });
        saveAs(blob, 'Report.pdf',true);
      },
      (error: HttpErrorResponse) => {
        console.log(error)
    });