好記憶不如爛筆頭，能記下點東西，就記下點，有時間拿出來看看，也會發覺不一樣的感受。

目錄

一、PDF的預覽方式

1.PDFObject

2.PDF.JS

3.jsPDF

4.jQuery Media Plugin

5.Google Docs PDF viewer

6.ZOHO Viewer

7.Anychart：使用JavaScript導出PDF

8.jQuery Document Viewer

二、Word的預覽方式

1.jQuery Media Plugin

2.PDFObject

3.PDF.JS

三、集成預覽

---

WEB預覽pdf或word，在web應用中，使用的頻率其實還是蠻多的，很多時候，都只是做展示，還不是在線編輯，在線編輯是比展現更高的一個使用層次。

如果要實現pdf 或 word 的預覽，那么該有哪些實現技術吶，答案下文揭曉：

一、PDF的預覽方式

主要是借助各種JS技術，實現PDF的預覽，主要有以下幾種：

1.PDFObject

官網：https://pdfobject.com/

PDFobject可以幫助你在頁面直接嵌入pdf文件，有時候有些項目需要動態地嵌入PDF文件。PDFObject為此而設計的，他能夠快速和容易的嵌入PDF文件，PDFObject使用JavaScript來產生相同的符合標準的?標記，然后插入?到您的HTML元素的選擇。您可以填滿整個瀏覽器窗口，或將PDF格式轉換成一個或其他塊級元素。

java實現可參考：https://blog.csdn.net/rhx_1989/article/details/108473596，

2.PDF.JS

官網：https://mozilla.github.com/pdf.js/

和 Google Chrome 使用的源自 Foxit 的閉源 PDF 瀏覽插件不同，PDF.js 是基于開放的 HTML5 及 JavaScript 技術實現的開源產品。pdf.js 是一個主要用于HTML5 平臺上在線閱讀PDF文檔的小插件，基于JavaScript技術編寫而成，無需任何本地技術支持。pdf.js是由Mozilla Labs發布的。他們的目標是創建一個通用的，基于標準的網絡平臺，能夠解析和渲染PDF文件，并最終發布一個PDF閱讀器擴展，毫無疑問 pdf.js 將被整合入 Gecko 成為 Firefox 的內嵌 PDF 閱讀器，但是具體整合時間表尚未確定

3.jsPDF

官網：https://parall.ax/

jsPDF 是一個使用Javascript語言生成PDF的開源庫。你可以在Firefox插件，服務端腳本或是瀏覽器腳本中使用它。客戶端Safari 和 iPhone Safari 支持得最好,其次是Opera和Windows下的Firefox 3等。IE暫不支持。

4.jQuery Media Plugin

官網：https://jquery.malsup.com/media/

jQuery Media Plugin是一款基于jQuery的網頁媒體播放器插件，它支持大部分的網絡多媒體播放器和多媒體格式，比如：Flash, Windows Media Player, Real Player, Quicktime, MP3,Silverlight, PDF。它根據當前的腳本配置，自動將a標簽替換成div，并生成object, embed甚至是iframe代碼，至于生成object還是embed，jQuery Media會根據當前平臺自動判別，因此兼容性方面非常出色下面這段代碼是jQuery Media生成后的。

5.Google Docs PDF viewer

官網：https://docs.google.com/viewer

不多說，這個可以去官網上了解下

6.ZOHO Viewer

官網：https://viewer.zoho.com/home.do

看人品，有時候是能打開的，有時候是不行的

7.Anychart：使用JavaScript導出PDF

官網：https://www.anychart.com/products/stock/online-demos/html-js-samples-center/export-as-pdf-js-call/index.html

上官網查看使用。

8.jQuery Document Viewer

官網：https://codecanyon.net/item/jquery-document-viewer/1732515?ref=bogdan_sandu

上官網查看使用。

二、Word的預覽方式
?

WORD 預覽方式現在主要有以下幾種方式

1.jQuery Media Plugin

官網：https://jquery.malsup.com/media/

她的思想是：將 word 轉換成 html，然后借助 jquery.media.js 來實現查看。效果有失真

2.PDFObject

官網：https://pdfobject.com/

上述已經描述，不在復述；可直接調用PDFObject.embed(url); 方法實現預覽；效果有失真

3.PDF.JS

官網：https://mozilla.github.com/pdf.js/

上述已經描述，不在復述；效果有失真

除過使用現有的js技術，其他的都是轉換成html，然后再直接返回到頁面進行瀏覽

三、集成預覽

目前沒有特別好的，可以完美實現在線預覽word，excel，pdf，ppt的可行性js實現方案，有的更多的是集成軟件的形式。

如openoffice ， onlyoffice 等等，但是他們都比較重，需要安裝程序，安裝完成之后才能進行調用服務進行預覽，有一定的限制性在里面；

具體在項目中使用哪種方式，就看決策者的意思了、

目前來看：總的表現最優的，實現功能最強的的，還是onlyoffice，她既可以實現在線預覽，又可以實現在線編輯，是一款比較不錯的web解決方案選項。

更多干貨：請移步微信公眾號： 碼出精彩 （codingba）

總結

以上是生活随笔為你收集整理的WEB在线预览PDF，WORD方案总结的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。