問題上移動顯示在iFrame的PDF Safari瀏覽器

在我們的Web應用中，我們在iframe使用下面的代碼行中顯示PDF文檔：問題上移動顯示在iFrame的PDF Safari瀏覽器

<iframe id="iframeContainer" src="https://example.com/pdfdoc.pdf" 
          style="width:100%; height:500px;"></iframe>

這適用於所有與寬度主要的桌面瀏覽器的罰款的PDF縮放以適應iFrame的範圍和垂直滾動條以查看文檔中的所有頁面。

但目前我無法在移動Safari中正確顯示PDF。在這種情況下，只有PDF的左上部分是可見的，沒有任何水平或垂直滾動條來查看文檔的其餘部分。

有沒有人知道我在移動Safari中解決此問題的方法？

更新 - 2013年3月

後搜索和實驗，我可以斷定，這個問題是一個真正的混亂的時間！有一堆解決方案，但每一個都遠非完美。任何其他人與這一個掙扎我建議參考'Strategies for the iFrame on the iPad Problem'。對於我來說，我需要寫下這一段，爲我們的iPad用戶尋找另一種解決方案。

更新 - 2015年5月

只是在這個問題上快速更新。最近我開始使用Google Drive查看器，該查看器主要解決了原始問題。只需提供PDF文檔的完整路徑，Google將返回HTML格式的PDF解釋（不要忘記設置embedded=true）。例如

https://drive.google.com/viewerng/viewer?embedded=true&url=www.analysis.im%2Fuploads%2Fseminar%2Fpdf-sample.pdf

我使用這個作爲較小的視口回退，只是嵌入上面的鏈接到我的。

來源

2013-03-18 QFDev

關於「更新 - 2015年5月」 - Google Drive查看器解決方案對我很好，似乎解決了我們遇到的IOS Safari和Android問題。謝謝！ – 2016-10-12 05:24:19

當在不同來源的iFrame上引用Google Drive時，這是如何工作的？嘗試嵌入Google雲端硬盤鏈接時，出現'X-Frame-Options'到'sameorigin'錯誤。 – vesperae 2017-09-13 18:44:08

我在想這樣可以解決我的問題，但是我用'Google預覽不可用'太多次了：/ – Ancinek 2018-03-05 11:04:45

嘗試pdf.js也應該移動Safari瀏覽器內工作：https://github.com/mozilla/pdf.js/

來源

2013-09-09 18:28:02 Mike

晚會過後，我一直在iOS上測試PDF.js一段時間，這是痛苦的。性能非常可怕，而且對於大型文檔，它會佔用太多的內存，導致瀏覽器崩潰。 – 2014-11-20 17:05:39

-1

我得到了同樣的問題。我發現通過將焦點設置爲輸入（不適用於div標籤），將顯示pdf。

我通過添加一個隱藏的輸入並將焦點設置在它上面來解決它。此解決方案不會減慢應用程序。

<html><head> 
<script> 
    $(document).ready(function() { 
     $("#myiframe").load(function() { setTimeout(function() { $(".inputforfocus").focus(); }, 100); }); 
    }); 
</script></head> 
<body> 
<div class="main"> 
    <div class="level1">Learning</div> 
    <input type="hidden" class="inputforfocus"> 
    <div> 
     <iframe src="PDF/mypdf.pdf" frameborder="0" id="myiframe" allow="fullscreen"></iframe> 
    </div> 
</div> 
</body> 
</html>

來源

2014-04-18 15:45:09 user2387011

我找到了一個新的解決方案。從iOS 8開始，移動Safari會將PDF作爲框架內HTML文檔中的圖像呈現。然後，您可以在PDF加載後調整寬度：

<iframe id="theFrame" src="some.pdf" style="height:1000px; width:100%;"></iframe> 
<script> 
document.getElementById("theFrame").contentWindow.onload = function() { 
    this.document.getElementsByTagName("img")[0].style.width="100%"; 
}; 
</script>

來源

2015-03-13 17:58:55

您節省了我的時間，仍然在iOS 10上呈現iFrame img – garanda 2017-03-16 19:33:21

但它只顯示PDF文檔的第一頁... – AlexAcc 2017-12-20 16:31:33

問題上移動顯示在iFrame的PDF Safari瀏覽器

回答

相關問題