浏览器中的文档预览答案

【问题标题】：Document Previews in Browser浏览器中的文档预览
【发布时间】：2011-09-02 23:07:37
【问题描述】：

有没有办法在浏览器中预览文档？特别是说页面中的 iframe，而不是在新选项卡中打开文档？我有一个任何类型的文件列表，当用户单击一个文件时，想要以只读格式打开它。如果该文件是视频或音频文件，这很容易，但我也希望能够制作 pdf、word 文档，也许是 excel。最好是跨浏览器友好的方式，但如果我需要对插件进行检测（我已经看过 Google Docs Viewer for FF），我可以接受。

更新：

ShaneC 的回答很棒，而且总体上会很好用。我看到的一个问题是对于 html5 设备（想想 ipad），我需要将文档转换为一系列图像。有什么办法让我以自动化的方式做到这一点？我需要能够在上传新文档时自动执行此操作。

【问题讨论】：

标签： javascript html iframe preview

【解决方案1】：

您需要集成一个跨浏览器的跨类型文档查看器。谷歌会给你一些好的网站，我个人对Flex Paper有很好的体验。

有关演示，请参见此处：http://flexpaper.devaldi.com/demo/

【讨论】：

这看起来非常棒。我会试一试。
请务必查看 HTML5 实现。我还没有用过那种味道，但它看起来很有前途（考虑到 iPad 之类的设备）。
@Endophage ：那是一个完全不同的蜡球。您将需要使用 PHP（或另一种动态语言）来遍历文档，然后创建它的图像。我个人没有这样做的经验，所以你最好用更新的标签提出一个新问题。但是，我可以建议您查看以下内容：PHP.NET Resource on PDF； A question thread where it seems someone got a resolution on a similar question

【解决方案2】：

还有另一种方法可以用来查看图片/pdf/xlsx/docx等。

您可以通过以下方式使用 iframe 和 google 的 gview：

 const YOUR_URL = https://calibre-ebook.com/downloads/demos/demo.docx;
 
 <iframe
   className="doc"
   src={`https://docs.google.com/gview?url=${YOUR_URL}&embedded=true`}
 />

【讨论】：

【解决方案3】：

有 Javascript ViewerJs. 一个开源工具，它允许网站显示 PDF 和开放标准的办公文档。它将内联显示文档，并且没有浏览器插件。

【讨论】：