最近为客户开发一个企业OA,需要在线预览各类文档,发现kkFileView提供在线预览的解决方案,而且集成方便。
kkFileView
官网:https://kkfileview.keking.cn
码云:https://gitee.com/kekingcn/file-online-preview
项目简介
此项目为文件文档在线预览项目解决方案,对标业内付费产品有【永中office】【office365】【idocv】等,在取得公司高层同意后以Apache协议开源出来反哺社区,在此特别感谢@唐老大的支持以及@端木详笑的贡献。该项目使用流行的spring boot搭建,易上手和部署,基本支持主流办公文档的在线预览,如doc,docx,Excel,pdf,txt,zip,rar,图片等等
项目特性
- 支持word excel ppt,pdf等办公文档
- 支持txt,java,php,py,md,js,css等所有纯文本
- 支持zip,rar,jar,tar,gzip等压缩包
- 支持jpg,jpeg,png,gif等图片预览(翻转,缩放,镜像)
- 支持mp3,mp4,flv等多媒体文件预览
- 使用spring boot开发,预览服务搭建部署非常简便
- rest接口提供服务,跨平台特性(java,php,python,go,php,…)都支持,应用接入简单方便
- 支持普通http/https文件下载url、http/https文件下载流url、ftp下载url等多种预览源
- 提供zip,tar.gz发行包,提供一键启动脚本和丰富的配置项,方便部署使用
- 提供Docker镜像发行包,方便在容器环境部署
- 抽象预览服务接口,方便二次开发,非常方便添加其他类型文件预览支持
- 最最重要Apache协议开源,代码pull下来想干嘛就干嘛
部署指南
环境要求
- Java: 1.8+
- OpenOffice或LiberOffice(Windows下已内置,CentOS或Ubuntu下会自动下载安装,MacOS下需要自行安装)
部署运行
物理机或虚拟机上运行
- 从 码云发行版本 下载最新版发行包
- 解压kkFileView-2.x.x.zip包
- 打开解压后文件夹的bin目录,运行startup脚本(Windows下以管理员身份运行startup.bat,Linux以root用户运行startup.sh)
- 浏览器访问本机8012端口 http://127.0.0.1:8012 即可看到项目演示用首页
Docker容器环境环境运行
- 拉取镜像
docker pull keking/kkfileview
- 运行
docker run -it -p 8012:8012 keking/kkfileview
后台运行
docker run -it -p 8012:8012 -d --name kkfileviwe-demo keking/kkfileview
启动成功:127.0.0.1:8012
可以在此页面进行测试,选择文档上传,在线预览
预览效果:
使用指南
当您的项目内需要预览文件时,只需要调用浏览器打开本项目的预览接口,并传入须要预览文件的url。
注意,如果要预览的url里包含需要转义的特殊字符,如下表格,请使用encodeURIComponent(url)转义
预览方式
1.普通文件下载url预览
var url = 'http://127.0.0.1:8080/file/test.txt'; //要预览文件的访问地址
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(url));
2.http/https下载流url预览
很多系统内不是直接暴露文件下载地址,而是请求通过id、code等参数到通过统一的接口,后端通过id或code等参数定位文件,再通过OutputStream输出下载,此时下载url是不带文件后缀名的,预览时需要拿到文件名,传一个参数fullfilename=xxx.xxx来指定文件名,示例如下
var originUrl = 'http://127.0.0.1:8080/filedownload?fileId=1'; //要预览文件的访问地址
var previewUrl = originUrl + '&fullfilename=test.txt'
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(previewUrl));
3.FTP下载url预览
- FTP匿名访问
如果要预览的FTP url是可以匿名访问的(不需要用户名密码),则可以直接通过下载url预览,示例如下
var url = 'ftp://127.0.0.1/file/test.txt'; //要预览文件的访问地址
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(url));
- 非匿名访问,确定只有访问一台FTP服务器
如果预览服务只访问一台FTP服务器,只需要在配置文件中 配置FTP链接信息 ,则可以直接通过下载url预览,示例如下
var url = 'ftp://127.0.0.1/file/test.txt'; //要预览文件的访问地址
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(url));
- 非匿名访问,不只访问一台FTP服务器
如果预览服务要访问多台FTP服务器,且用户名密码不一致,可以通过在url中加入用户名密码等参数预览(url参数中的优化于配置文件中的),示例如下
var originUrl = 'ftp://127.0.0.1/file/test.txt'; //要预览文件的访问地址
var previewUrl = originUrl + '?ftp.username=xx&ftp.password=xx&ftp.control.encoding=xx';
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(previewUrl));
配置说明
更多配置参考官网:
https://kkfileview.keking.cn/zh-cn/docs/config.html
前端项目使用集成:
//例子使用比较简洁
//1. 引入base64
let Base64 = require("js-base64").Base64;//
//2.预览文档访问的地址
var url ="var url ="http://192.168.3.68:30666/20210205/1357596931101736962/java面试题整理.docx""
//3.调用kkFileView进行预览
window.open(
"http://192.168.3.68:8012/onlinePreview?url=" + encodeURIComponent(Base64.encode(url))
);