html - iframe pdf 无法在移动设备上正确显示

Question

我有一个应用程序，它是一个显示网页的 web 视图。在页面中，我使用以下内容显示 pdf 文档：

<iframe id="pdfReport" class="pdfFrame"></iframe>

当页面加载给定路径的pdf时，iframe中会显示。

$(window).on('load', function() {
    var pdfDoc = pathToPdf
    document.getElementById('pdfReport').src = pdfDoc;
});

如果使用 PC 或笔记本电脑上的浏览器查看，则显示效果很好 - 文件名、页数等：

如果使用 iPad（Chrome 或 Safari）查看，它只显示第 1 页，滚动，无框架，文件名，页数等：

如何让 pdf 在设备中正确显示？

标签： htmlpdfiframe

Answer 1

你试过谷歌文档查看器吗？

$(window).on('load', function() {
    var pdfDoc = "https://www.yourpdf.com/";
    var pathToPdf =  "http://docs.google.com/viewer?url=" + pdfDoc + "&embedded=true";
    var pdfDoc = pathToPdf
    document.getElementById('pdfReport').src = pdfDoc;
});