引言
前面寫了多篇關于<跨平臺文件在線預覽解決方案>，不管使用pdf.js、LibreOffice，還是永中DCS，各自都有自己的優缺點，比如：pdf.js不支持雙指放大縮小，LibreOffice加載緩慢，永中DCS收費等等。
本文基于uni-app平臺實現了Office文檔在線預覽原生插件Seal-OfficeOnline，同時支持Android和iOS，歡迎下載使用~
image
[圖片上傳失敗...(image-adf004-1603082126673)]
快速上手
開發工具：HBuilderX
Step1. 下載demo工程，使用HBuilderX打開
Step2. 下載本文插件
插件名稱：Seal-OfficeOnline
下載插件解壓放置到項目根目錄nativeplugins下，如圖：
image
Step3. 選擇manifest.json->App原生插件配置中加載本地插件
image
Step4. 使用插件
- 在vue或nvue組件中，導入插件
var testModule = uni.requireNativePlugin("Seal-OfficeOnline")
- 使用openFile方法預覽Office文件，支持如下格式：pdf、txt、doc、docx、xls、xlsx、ppt、pptx
testModule.openFile({
url: 'http://113.62.127.199:8090/fileUpload/1.xlsx',
topBarBgColor: '#3394EC',
topBarTextColor: '#FFFFFF',
title: 'Office文檔在線預覽',
isBackArrow: false,
fileType: 'xlsx',
fileName: '1'
});
openFile方法參數說明
url
url參數支持如下三種地址方式：
手機本地文件地址，如：/data/user/0/com.HBuilder.UniPlugin/files/1.xlsx
文件名，如：1.xlsx，訪問默認目錄文件，默認目錄為：/data/user/0/com.HBuilder.UniPlugin
注意：手機本地地址目錄需要有權限訪問
title
title表示頂欄文本，默認為：SealOfficeOnline
topBarBgColor
topBarBgColor表示頂欄背景顏色，默認為：#177cb0（靛青）
topBarTextColor
topBarTextColor表示頂欄文本顏色，默認為：#FFFFFF（白色）
isBackArrow
isBackArrow表示是否顯示返回按鈕，默認為：true（顯示）
fileType
fileType表示可以指定文件類型，如：xlsx，在url參數無法判斷文件類型時，可以指定文件類型
fileName
fileName可以指定文件名，如：file1，注意此處不帶文件擴展名，如果同時指定fileName和fileType，那么最后的文件名通過這兩個參數組合起來，即：fileName.fileType
Android預覽效果
預覽docx
image
預覽pptx
image
預覽xlsx
image
預覽pdf
image
預覽txt
image
iOS預覽效果
預覽docx
image
預覽pptx
image
預覽xlsx
image
預覽pdf
image
預覽txt
image
