在偶然的翻阅大佬博客的时候,发现一个挺有意思的项目:kkFileView,在线文件预览项目
1. kkFileView介绍
kkFileView是git的开源在线文件预览项目 支持格式:doc、docx、ppt、pptx、xls、xlsx、zip、rar、mp4、mp3以及众多类文本如txt、html、xml、java、properties、sql、js、md、json、conf、ini、vue、php、py、bat、gitignore 官方演示:https://file.keking.cn/index 官方文档:https://kkfileview.keking.cn/zh-cn/docs/home.html 该项目使用流行的spring boot搭建,易上手和部署,可以进行二次开发和独立部署,是一个很方便易使用的文件预览项目。
2. 源码下载
gitee下载地址:https://gitee.com/kekingcn/file-online-preview
3. 项目启动和配置修改
- 项目源码下载完之后,导入到IDEA,并安装pom.xml的相关依赖。
- 可以自定义项目的首页,或者关闭默认的首页演示。
- 可以进入application.properties文件根据自己的需求修改配置,如端口、文件大小限制、添加水印、文件预览等相关配置,具体可以查看官方文档:https://kkfileview.keking.cn/zh-cn/docs/config.html
- 也可以根据自己的需求修改源码,对项目进行二次开发,比如加个授权什么的等等...
- IDEA直接运行启动文件即可以启动。
4. 项目打包和部署
4.1、打包
该项目是springboot项目,直接使用maven打包即可
代码语言:javascript复制cd file-online-preview
mvn clean package -DskipTests
或者使用IDEA的maven工具(注意打包的父模块)
项目打包后会生成四个文件:
- kkFileView-4.1.0-SNAPSHOT.jar(Spring Boot打包后得到jar包)
- kkFileView-4.1.0-SNAPSHOT.jar.original(是Maven在Spring Boot重新打包之前创建的原始jar文件)
- kkFileView-4.1.0-SNAPSHOT.tar.gz(Linux版本:项目中通过assembly配置,生成的发行项目包,带配置好的启动脚本startup.sh等)
- kkFileView-4.1.0-SNAPSHOT.zip(Window版本:项目中通过assembly配置,生成的发行项目包,带配置好的启动脚本startup.bat等)
注意:在配置文件中startup.sh或startup.bat的文件名,可能与IDEA打包生成的文件名不一致,需要自己修改。
4.2、部署
正确打包好了的话,部署的相对比较简单。
- 首先将打包好的源码上传到服务器(Linux)
- 终端解压后进入bin目录,直接执行:./startup.sh 脚本就运行了
- 执行:./startup.sh可以查询项目运行的日志
然后进行反向代理:
示例配置文件如下
代码语言:javascript复制location /
{
proxy_pass http://127.0.0.1:8080;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header REMOTE-HOST $remote_addr;
add_header X-Cache $upstream_cache_status;
#Set Nginx Cache
add_header Cache-Control no-cache;
}
到此为止,kkFileView项目就已经部署成功了: 我的部署演示:http://fileview.qkongtao.cn/
文件预览:
默认的office文件预览是转成图片模式预览,点击右边的PDF图标,可以转成PDF进行预览(可以文字复制和下载等,也有很多小工具)
4.3、文件预览乱码问题
大部分Linux系统上并没有预装中文字体或字体不全,需要把常用字体拷贝到Linux服务器上,具体操作如下: 下载如下字体包 http://kkfileview.keking.cn/fonts.zip 文件解压完整拷贝到Linux下的 /usr/share/fonts目录。然后依次执行mkfontscale 、mkfontdir 、fc-cache使字体生效。 具体可参考官方文档:https://kkfileview.keking.cn/zh-cn/docs/faq.html
5. web中使用API
在前端页面中使用该文件预览API很简单,示例如下:
代码语言:javascript复制<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script type="text/javascript" src="http://qkongtao.cn/file/lib/base64.js"></script>
</head>
<body>
<button onclick="preview()">点击预览</button>
<script>
function preview() {
var url = 'https://api.idocv.com/data/doc/manual.docx'; //要预览文件的访问地址
window.open('http://fileview.qkongtao.cn/onlinePreview?url=' encodeURIComponent(Base64.encode(url)));
}
</script>
</body>
</html>
也可以参考官方文档的其他应用:https://kkfileview.keking.cn/zh-cn/docs/usage.html