为彩虹外链网盘添加在线文件预览功能
我自己部署了一个网盘服务,用的是彩虹外链网盘程序。用于文件中转站,以及公开文件外链。因为程序主要解决的是存储和外链的功能,网盘内文件预览的功能就没做多少,目前仅支持常规图片和音频视频文件预览播放,以及站外引用微软文档预览服务(view.officeapps.live.com)预览Office文档。
现在我想给这个程序增加预览更多文件格式的能力。但鉴于自己编程能力以及时间精力有限的问题,一直没有做。
今天在浏览阮一峰的科技爱好者周刊(第 402 期)时,看到了开源的File Viewer项目,觉得特别适合集成在彩虹外链网盘程序上,所以现在立刻行动起来,一边编辑此片博文,一边一步一步进行集成。

File Viewer:https://github.com/flyfish-dev/file-viewer
通过阅读项目文档,了解主要可以通过两种方式接入,一种是直接 Script 标签引用官方JS,通过几行代码,加载预览功能。二是把项目运行在自己的服务上,再通过引用本地接口加载功能。
因为不想费事,决定用最简便的方式,简单修改一下彩虹外链网盘的程序文件,引用站外JS加载预览功能。
<script src="https://cdn.jsdelivr.net/npm/@file-viewer/web-full@latest/dist/flyfish-file-viewer-web-full.iife.js"></script>
<flyfish-file-viewer src="/files/report.pdf" theme="light" toolbar-position="bottom-right" style="display:block;height:720px"></flyfish-file-viewer>

我详细阅读了彩虹外链网盘PHP代码,了解了程序自带的预览功能逻辑:
- 上传文件时,upload.php 程序获取文件的文件名、文件后缀、文件大小、HASH值等基本信息,并写入数据库;
file.php 是文件查看功能,读取数据库获得对应文件的基本信息,引用 includes/functions.php
再通过文件后缀名判定函数,开启对应文件的预览功能;- 图片、音频、视频文件直接调用相关组件预览显示(具体文件格式参见“后台管理>系统设置>文件上传设置”);
- doc、docx、xps、rtf、wps、xls、xlsx、ppt、pptx等文件显示在线预览按钮,链接到微软文档预览器;
- 其他格式文件直接显示下载按钮。
- 图片格式可以用view.php预览,音频和视频文件可以用player.php预览。
最后经过考虑,决定不大幅度改动原程序的文件,做如下改动:
- 参考 player.php 代码,新写一个 viewer.php 用于预览文件;
- 不改动 file.php 自带的预览功能,在页面增加一个“文件预览”按钮;
- 修改 index.php 文件在首页的文件列表增加一个预览链接;
- 在管理后台的文件列表也增加一个预览链接的,需要改动 admin/file.php 和 admin/ajax_file.php 两个文件。
效果如下:


具体效果演示可以访问我的网盘查看:
https://pan.chenzhizuo.com/
改动的文件如下,可以下载部署到你自己的彩虹外链网盘项目中。可以按需选择要修改的位置,修改或替换对应文件:
viewer.php -彩虹外链网盘文件预览插件
file.php -彩虹外链网盘文件查看页
index.php -彩虹外链网盘首页文件
admin/ajax_file.php -彩虹外链网盘管理员后台文件列表获取
admin/file.php -彩虹外链网盘管理员后台文件列表
注:彩虹外链网盘V5.6 (Build 1532)