如何在HTML中嵌入PDF文件？

Question

如何在HTML中嵌入PDF文件？

5

我想在我的HTML文件中嵌入PDF文件（可以使用 embed 标签或 iframe 标签）。

我尝试了以下两种方法。 在火狐浏览器上都可以正常工作，但在 Chrome、Chromium 和 Android 浏览器上无法正常工作。

<embed type="application/pdf" src="myfile.pdf"></embed>
<iframe class="embed-responsive-item" src="myfile.pdf" allowfullscreen></iframe>

我还尝试使用 php 读取 pdf 文件，然后使用 iframe 来显示它，像这样：

header("Content-type: application/pdf");
header("Content-Disposition: inline; filename=".$_GET['pdf']);
@readfile($CONFIG['PDF']."/".$_GET['pdf']);

注意，这在Chrome/Chromium和移动浏览器上无法工作，仅适用于桌面版Firefox。

我不确定这是否是重要信息，但我还设置了X-Frame-Options“ALLOW-FROM mydomain.com”

这里您将找到问题的示例。

是否有其他方法可以在网页上嵌入PDF文件？

- Nick Arnie

你有收到任何错误信息吗？它们在Chrome中只是没有显示出来还是根本没有被请求？ - Joeri

我在浏览器上发现了一个之前没有注意到的错误信息。它显示“X-Frame-Options: “ALLOW-FROM mydomain.com"。根据https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options，这已经被弃用了。我将其更改为“SAMEORIGIN”，但问题仍然存在。 - Nick Arnie

它是有效的，但您可能需要向下滚动一点到该页面上的“浏览器兼容性”部分... - CBroe

你是正确的。我已经更改了它，也没有错误信息。PDF 文件仍然无法在 Chrome / Chromium 等浏览器中加载。 - Nick Arnie

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Fareed Khan · Accepted Answer

安卓上的Chrome浏览器不再支持PDF嵌入式。您可以使用Google Drive PDF查看器来获取此功能:

<embed src="https://drive.google.com/viewerng/
viewer?embedded=true&url=http://example.com/the.pdf" width="500" height="375">

您也可以使用谷歌PDF查看器来实现这个功能。您需要先将PDF上传到某个地方，然后只需使用其URL即可：

<iframe src="http://docs.google.com/gview? url=http://example.com/mypdf.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>