HTML Inline PDF

Question

我試圖在我的HTML中內聯顯示PDF文檔。但是，我所知道的所有方法都顯示了空白的內容區域。到目前爲止，我試着用下面的所有方法http://codepen.io/abhishekisnot/pen/WxmPmd/?editors=1001

：

<object data="http://www.pro-react.com/materials/appendixA.pdf" type="application/pdf" width="100%" height="100%" style="border: 1px solid red;"></object> 

<embed src="http://www.pro-react.com/materials/appendixA.pdf" width="100%" height="100%" type='application/pdf' style="border: 1px solid red;"> 

<iframe src="http://www.pro-react.com/materials/appendixA.pdf" width="100%" height="100%" style=" border: 1px solid red;" frameborder="0"></iframe> 

Answer 1

你可能不會發現，如果你想跨瀏覽器的工作原理一致的方式

請點擊這裏查看示例使用基於瀏覽器或瀏覽器插件的查看器將PDF顯示爲實際的PDF。您將需要其中一個JavaScript查看器，因爲它們會將PDF轉換爲HTML5並顯示該查看器。

對象標記和嵌入標記都依賴於瀏覽器插件來顯示由src或數據引用的內容，諸如Edge，Chrome和Safari等瀏覽器不使用插件來顯示PDF，它們本身支持它並提供他們自己的Chrome來導航PDF。我不認爲這些將與這些標籤一起工作。

Answer 2

看看這個問題：Recommended way to embed PDF in HTML?。它有很多有用的信息。

但是我實現了一個稍微不同的解決方案，請參閱此答案：https://stackoverflow.com/a/15971133/932282。