⭐⭐⭐ Spring Boot 项目实战 ⭐⭐⭐ Spring Cloud 项目实战
《Dubbo 实现原理与源码解析 —— 精品合集》 《Netty 实现原理与源码解析 —— 精品合集》
《Spring 实现原理与源码解析 —— 精品合集》 《MyBatis 实现原理与源码解析 —— 精品合集》
《Spring MVC 实现原理与源码解析 —— 精品合集》 《数据库实体设计合集》
《Spring Boot 实现原理与源码解析 —— 精品合集》 《Java 面试题 + Java 学习指南》

摘要: 原创出处 江南一点雨 「江南一点雨」欢迎转载,保留摘要,谢谢!


🙂🙂🙂关注微信公众号:【芋道源码】有福利:

  1. RocketMQ / MyCAT / Sharding-JDBC 所有源码分析文章列表
  2. RocketMQ / MyCAT / Sharding-JDBC 中文注释源码 GitHub 地址
  3. 您对于源码的疑问每条留言都将得到认真回复。甚至不知道如何读源码也可以请教噢。
  4. 新的源码解析文章实时收到通知。每周更新一篇左右。
  5. 认真的源码交流微信群。

一 文件在线预览

在现代工作与生活环境中,文件共享与查看已经成为日常不可或缺的一部分。不过传统的文件处理方式要求用户下载文件到本地后才能查看,这不仅占用了设备的存储空间,还可能导致文件传播效率低下,甚至存在安全隐患。

因此,现在很多应用都支持文件在线预览,像我们常见的 docx、pptx、xlsx、md、图片、pdf 等等都可以在浏览器中直接查看文件内容,无需下载,大大提高了文件处理的便捷性和安全性。

二 kkFileView

kkFileView 是一个基于 Spring Boot 框架构建的开源文件文档在线预览解决方案。它不仅支持广泛的文件类型,而且使用非常简单。

kkFileView 主要有如下一些特点:

  • 广泛支持的文件类型:kkFileView 支持包括但不限于 doc、docx、xls、xlsx、ppt、pptx、pdf、txt 等主流办公文档,以及 jpg、jpeg、png、gif 等图像文件,mp3、wav、mp4、flv 等音视频格式,zip、rar、jar 等压缩包文件,还有多种类文本及代码文件,如 html、xml、json、yaml、java、py、cpp 等。
  • 易部署性:kkFileView 提供了 ZIP、TAR.GZ 发行包和 Docker 镜像,支持一键启动脚本和丰富的配置项,无论是物理机、虚拟机还是 Docker 容器环境,都能轻松部署。
  • 跨平台服务:kkFileView 支持 Windows、Linux 和 MacOS 等多种操作系统,实现了跨平台的无缝使用。
  • 高性能:基于高效的文件读取与流传输策略,kkFileView 在处理大文件时也能保持流畅,提升用户体验。
  • 安全性:通过设置访问权限和时效性 token,kkFileView 可以有效保护文件安全,防止未授权访问和恶意操作。
  • API 接口:提供 RESTful API,支持 Java、PHP、Python、Go 等多种开发语言,方便与其他系统集成。
  • 开源免费:kkFileView 遵循 Apache 2.0 许可证,用户可以根据需要自由修改和分发。
  • 扩展性强:支持多种文件类型,且易于添加新的文件类型支持或自定义显示模板。

三 使用 kkFileView

kkFileView 是独立部署运行的,所以使用起来非常方便。

3.1 安装部署

kkFileView 需要先安装才能使用。这也是官方推荐的使用方式。

安装有两种方式。

下载源码启动

  1. 从 https://gitee.com/kekingcn/file-online-preview/releases 下载最新版发行包
  2. 解压 kkFileView-x.x.x 文件(Windows 用 .zip 包,Linux/MacOS 用 .tar.gz 包)
  3. 打开解压后文件夹的 bin 目录,运行 startup 脚本(Windows 下以管理员身份运行startup.bat,Linux 以 root 用户运行 startup.sh)
  4. 浏览器访问本机 8012 端口 http://127.0.0.1:8012 即可看到项目演示用首页

Docker 启动

启动脚本:

docker run -it -p 8012:8012 keking/kkfileview:4.1.0

如果网络不畅,可以通过如下方式启动:

wget https://kkfileview.keking.cn/kkFileView-4.1.0-docker.tar
docker load -i kkFileView-4.1.0-docker.tar
docker run -it -p 8012:8012 keking/kkfileview:4.1.0

启动之后,页面如下:

3.2 文件预览

当我们的项目内需要预览文件时,只需要调用浏览器打开 kkFileView 的预览接口,并传入须要预览文件的 url,类似下面这样:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/js-base64@3.6.0/base64.min.js"></script>
</head>
<body>
<script>
var url1 = 'http://192.168.43.178:8080/1.csv';
var url2 = 'http://192.168.43.178:8080/2.png';
var url3 = 'http://192.168.43.178:8080/3.doc';
var url4 = 'http://192.168.43.178:8080/4.pdf';
var url5 = 'http://192.168.43.178:8080/5.pptx';
var url6 = 'http://192.168.43.178:8080/6.md';
</script>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url1)));">csv</button>
<br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url2)));">png</button>
<br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url3)));">doc</button>
<br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url4)));">pdf</button>
<br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url5)));">pptx</button>
<br>
<button onclick="window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(Base64.encode(url6)));">md</button>
<br>
</body>
</html>

url1~url6 是我这里几个不同格式文件的访问地址,调用 kkFileView 的预览接口 http://127.0.0.1:8012/onlinePreview,并将我们的文件 url 作为参数传递进去,就可以预览文件内容了。

是不是很简单!

这是官方给的使用方式。如果想把这个项目合并到自己现有项目中,也是可以的,只是稍微麻烦一些,需要分析接口并且手动合并代码了,不过对于有经验的小伙伴来说,应该也不是啥难事。

文章目录
  1. 1. 一 文件在线预览
  2. 2. 二 kkFileView
  3. 3. 三 使用 kkFileView
    1. 3.1. 3.1 安装部署
      1. 3.1.1. 下载源码启动
      2. 3.1.2. Docker 启动
    2. 3.2. 3.2 文件预览