在iOS和Mobile Safari或Chrome上使用ngx-extended-pdf-viewer进行打印

时间:2019-04-01 19:27:33

标签: ios angular pdf printing mobile-safari

我有一个Angular 7应用程序,该应用程序使用ngx-extended-pdf-viewer呈现从web.api作为字节数组获取的PDF。我没有渲染PDF甚至从任何桌面应用程序打印它的问题。 ngx-extended-pdf-viewer作为内置的打印按钮。但是,当尝试从iPhone(iOS 12)上的Safari打印时,它仅打印空白页面,其网址在底部。实际的PDF不打印。有了iOS上的Chrome,它什么也看不到。我对Angular和移动Web开发还很陌生,所以也许知识不足使我受益。 PDF查看器位于mat-tab中,因此不确定是否会引起某些问题?

我尝试了其他软件包,但它们似乎都基于Mozilla的相同pdf.js代码。这也是我到目前为止发现的唯一可以打印的内容。我当时正在考虑在npm软件包之外尝试pdf.js,但是到目前为止,还没有找到使它在Angular中起作用的明确指导。我敢肯定,但是我发现的所有方向似乎都忽略了细节。例如,将此代码放在您的应用中。他们只是无法说出应用程序中的位置。

从web.api:

[HttpPost("GetPdfBytes/{PdfId}")]
public ActionResult<byte[]> GetPdfBytesId([FromBody]int id)
{
    string exactPath = string.Empty;
    if (id == 1)
    {
        exactPath = Path.GetFullPath("pdf-test.pdf");
    }
    else if (id == 2)
    {
        exactPath = Path.GetFullPath("DPP.pdf");
    }
    else if (id == 3)
    {
        exactPath = Path.GetFullPath("Request.pdf");

    }
    else
    {
        exactPath = Path.GetFullPath("Emergency Issue.pdf");

    }
    byte[] bytes = System.IO.File.ReadAllBytes(exactPath);
    return Ok(bytes);

}

HTML:

<mat-tab label="PDF">
  <ng-template matTabContent>
      <ngx-extended-pdf-viewer *ngIf="visible[2]" id="pdf3" [src]="pdfSrc3" useBrowserLocale="true" delayFirstView="1000" showSidebarButton="false"
      showOpenFileButton="false" >
      </ngx-extended-pdf-viewer>
  </ng-template>
</mat-tab>

TypeScript:

getPDFBytesId(id: string) {
  this.getPDFFromServicePdfBytesId(Number(id)).subscribe(
    (data: any) => {
        this.pdfSrc3 = this.convertDataURIToBinary(data);
   },
   error => {
       console.log(error);
   }
 );
}

// hits the web.api

getPDFFromServicePdfBytesId(id: number): Observable<any> {
  const body = id;
  return this.http.post<any>('http://localhost:5000/api/values/GetPdfBytes/' + id, body);
}

// converts what we got back to a Uint8Array which is used by the viewer

convertDataURIToBinary(dataURI: string) {
  const raw = window.atob(dataURI);
  const rawLength = raw.length;
  const array = new Uint8Array(new ArrayBuffer(rawLength));

  for (let i = 0; i < rawLength; i++) {
  array[i] = raw.charCodeAt(i);
  }
  return array;
}

0 个答案:

没有答案