引言
后面写了多篇对于<跨平台文件在线预览解决方案>,不论应用pdf.js、LibreOffice,还是永中DCS,各自都有本人的优缺点,比方:pdf.js不反对双指放大放大,LibreOffice加载迟缓,永中DCS免费等等。
- 跨平台(uni-app)文件在线预览解决方案
- 跨平台文件在线预览解决方案(二)
- 跨平台文件在线预览解决方案(三)- LibreOffice vs OpenOffice
本文基于uni-app平台实现了Office文档在线预览原生插件Seal-OfficeOnline,同时反对Android和iOS,欢送下载应用~
Seal-OfficeOnline插件下载应用地址
<div class="half">
</div>
疾速上手
demo工程地址
开发工具:HBuilderX
Step1. 下载demo工程,应用HBuilderX关上
Step2. 下载本文插件
插件名称:Seal-OfficeOnline
下载插件解压搁置到我的项目根目录nativeplugins
下,如图:
Step3. 抉择manifest.json->App原生插件配置
中加载本地插件
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参数反对如下三种地址形式:
- 文件网络地址,如:http://113.62.127.199:8090/fileUpload/1.xlsx
- 手机本地文件地址,如:/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
预览pptx
预览xlsx
预览pdf
预览txt
iOS预览成果
预览docx
预览pptx
预览xlsx
预览pdf
预览txt
转载请注明:我的技术分享 » 跨平台文件在线预览解决方案(四)-Android和IOS原生插件