ios - 在 iOS 和 Mobile Safari 或 Chrome 上使用 ngx-extended-pdf-viewer 进行打印
问题描述
我有一个 Angular 7 应用程序,它使用 ngx-extended-pdf-viewer 来呈现我从 web.api 作为字节数组获得的 PDF。渲染 PDF 甚至从任何桌面应用程序打印它都没有问题。ngx-extended-pdf-viewer 作为内置的打印按钮。但是,当尝试从 iPhone (iOS 12) 上的 Safari 打印时,它只会打印底部带有 url 的空白页。实际的 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>
打字稿:
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;
}
解决方案
推荐阅读
- javascript - 表单提交返回内容类型为 application/json 而不是 text/html 的响应
- c - “文件指针”,“流”,“文件描述符”和......“文件”之间的区别?
- oracle - Oracle Apex 在批准者使用触发器和 Apex 邮件批准问题时发送电子邮件
- javascript - 在 codepen 中,Intersection 观察者的行为与浏览器窗口不同
- c# - 使用 Selenium C# 时的弹出/警报窗口
- maven - 跳过测试时,有没有办法使 mvn clean install 失败?
- javascript - vue-router 无法解析异步组件默认值:TypeError:无法读取未定义的属性“调用”
- android - React Native 未检测到 Android 模拟器
- verilog - 模块输入的宽度可以在模块内部确定吗?
- java - 未根据 Log4j2.properties 加载日志