MInio + kkFileView 通用服务端在线文件文档预览方案

一、kkFileView

kkFileView 是一个基于 SpringBoot 开发的万能文件预览开源项目,允许用户在浏览器端实时查看文件内容。

支持的文件类型如下:

  1. 支持 doc, docx, xls, xlsx, xlsm, ppt, pptx, csv, tsv, dotm, xlt, xltm, dot, dotx,xlam, xla 等 Office 办公文档
  2. 支持 wps, dps, et, ett, wpt 等国产 WPS Office 办公文档
  3. 支持 odt, ods, ots, odp, otp, six, ott, fodt, fods 等OpenOffice、LibreOffice 办公文档
  4. 支持 vsd, vsdx 等 Visio 流程图文件
  5. 支持 wmf, emf 等 Windows 系统图像文件
  6. 支持 psd 等 Photoshop 软件模型文件
  7. 支持 pdf ,ofd, rtf 等文档
  8. 支持 xmind 软件模型文件
  9. 支持 bpmn 工作流文件
  10. 支持 eml 邮件文件
  11. 支持 epub 图书文档
  12. 支持 obj, 3ds, stl, ply, gltf, glb, off, 3dm, fbx, dae, wrl, 3mf, ifc, brep, step, iges, fcstd, bim 等 3D 模型文件
  13. 支持 dwg, dxf 等 CAD 模型文件
  14. 支持 txt, xml(渲染), md(渲染), java, php, py, js, css 等所有纯文本
  15. 支持 zip, rar, jar, tar, gzip, 7z 等压缩包
  16. 支持 jpg, jpeg, png, gif, bmp, ico, jfif, webp 等图片预览(翻转,缩放,镜像)
  17. 支持 tif, tiff 图信息模型文件
  18. 支持 tga 图像格式文件
  19. 支持 svg 矢量图像格式文件
  20. 支持 mp3,wav,mp4,flv 等音视频格式文件
  21. 支持 avi,mov,rm,webm,ts,rm,mkv,mpeg,ogg,mpg,rmvb,wmv,3gp,ts,swf 等视频格式转码预览

官方介绍文档如下:

https://kkview.cn/zh-cn/docs/home.html

Giee 地址:

https://gitee.com/kekingcn/file-online-preview

kkFileView 的使用极易上手,使用 http 接口访问,不需要和应用集成,具有跨系统跨语言使用的特性。提供 Windows / Linux 版本发行包、自定义配置文件、和一键启动 / 停止脚本等,极大方便部署使用,同时官方提供 Docker 镜像,方便容器环境中部署使用。

因此仅需单独将 kkFileView 部署好后,文件交由minio存储和维护,然后提供文件的 url 地址既可实现在线预览,如下图所示:

在这里插入图片描述

二、MInio + kkFileView 预览方案实现

kkFileView 是一个基于 SpringBoot 开发的开源项目,这里使用基于源码的方式启动服务。

下载源码:

https://gitee.com/kekingcn/file-online-preview/repository/archive/v4.4.0-beta.zip

下载后,使用 IDEA启动,或者将其打包后启动,在日志中可以看到演示地址:

在这里插入图片描述

在这里插入图片描述

下面可以在 Minio 中创建一个测试 Buckets,并且这里访问策略选择 public

在这里插入图片描述

然后可以上传一个测试文档:

在这里插入图片描述

由于访问策略选择的 public, 因此该文件的访问 url 为: http://{Minio 地址}:9000/{Buckets Name}/{File name}

将文件地址复制到上面 kkFileView 页面的预览窗口中:

在这里插入图片描述

在这里插入图片描述

从地址栏可以看出,kkFileView 的预览链接规则其实是:http://{kkFileView 地址}:8012/onlinePreview?url={文件地址}

因此正如文档中所写的,对原系统无侵入,前端只需两行代码既可集成完毕:

var url = 'http://127.0.0.1:8080/file/test.txt'; //要预览文件的访问地址
window.open('http://127.0.0.1:8012/onlinePreview?url='+encodeURIComponent(previewUrl));

PDF 文档预览:

在这里插入图片描述

PPT 文件预览:

在这里插入图片描述

Excel 文件预览:

在这里插入图片描述