h5ai是什么
H5ai是一款功能强大 php 文件目录列表程序,它提供多种文件目录列表呈现方式,支持多种主流 Web 服务器,例如 Nginx、Apache、Cherokee、Lighttpd 等,支持多国语言,可以使用本程序在线预览文本、图片、音频、视频等。
演示网站:https://release.larsjung.de/
安装
方便管理,使用宝塔并以LNMP环境运行
安装宝塔,(已安装的跳过)
#Centos yum install -y wget && wget -O install.sh http://download.bt.cn/install/install.sh && sh install.sh #Ubuntu/Deepin wget -O install.sh http://download.bt.cn/install/install-ubuntu.sh && sudo bash install.sh #Debian wget -O install.sh http://download.bt.cn/install/install-ubuntu.sh && bash install.sh
宝塔安装完成后,先在面板设置中修改用户名,密码,面板别名等,然后返回首页选择LNMP一键安装,PHP版本建议7.0或以上
添加网站
添加网站,输入你已指向到VPS的域名,FTP和数据库不创建。确定
打开目录
网站管理,打开网站目录 如 /www/wwwroot/xxx.xxx
删除目录下自动创建的的所有文件 (4个)
下载程序
远程下载,输入程序下载地址来下载。目前最新版:https://release.larsjung.de/h5ai/h5ai-0.29.0.zip
随时间推移,程序会更新,可以自己进官网查看最新版本:https://larsjung.de/h5ai/
解压程序
下载完成后解压,解压后的网站根目录应该只有一个_h5ai目录和你刚才下载的程序包
PHP设置
1.软件管理-你使用的PHP版本-设置-禁用函数-删除exec函数
2.软件管理-你使用的PHP版本-设置-安装扩展-安装exif扩展
站点修改
网站管理-设置网站-配置文件-在index index.php…最后加上内容 /_h5ai/public/index.php
注意前面有个英文状态下的空格和保留最后的;正确修改后应该是这样的
index index.php index.html index.htm default.php default.htm default.html /_h5ai/public/index.php ;
h5ai的目录列表应该是这样的,即你要显示的文件或文件夹要放站网站根目录
├── _h5ai │ ├── CHANGELOG.md │ ├── private │ ├── public │ └── README.md ├── 您要显示的文件夹 │ ├── 子文件夹1 │ ├── 文件1 │ └── 文件2 └── 您要显示的文件 ├── 文件1 └── 文件2
到此h5ai已经可以正常运行了,如果需要开启更多功能继续往下看
更多功能
通过你的域名+/_h5ai/public/index.php 可以查看 h5ai 的功能开启情况,默认密码是空的。
安装 FFmpeg (用于显示视频缩略图)
Debian 8:
编辑软件源文件:
vim /etc/apt/sources.list
添加四个软件源
deb http://www.deb-multimedia.org jessie main non-free deb ftp://ftp.deb-multimedia.org jessie main non-free deb http://www.deb-multimedia.org stable main non-free deb ftp://ftp.deb-multimedia.org stable main non-free
更新软件源
apt-get -y update
安装 ffmpeg
apt-get -y install ffmpeg
Ubuntu 16.04+:
通过命令安装:
apt-get -y install ffmpeg
CentOS:
rpm --import http://li.nux.ro/download/nux/RPM-GPG-KEY-nux.ro rpm -Uvh http://li.nux.ro/download/nux/dextop/el7/x86_64/nux-dextop-release-0-1.el7.nux.noarch.rpm yum -y install ffmpeg
安装 ImageMagick (用于显示PDF缩略图)
Ubuntu/Debian:
apt-get install ImageMagick -y
CentOS:
yum install ImageMagick -y
通过你的域名+/_h5ai/public/index.php应该能看到全部功能处于绿色情况,即全部功能开启
功能开关
通过编辑_h5ai/private/conf/options.json实现功能开关
启用打包下载:
搜索 “download”
127 行,enabled 由 false 改为 true。
启用文件信息及二维码:
搜索 “info”
185 行,enabled 由 false 改为 true。
默认简体中文:
搜索 “l10n”
202 行,enabled 由 false 改为 true。
启用文件及文件夹多选:
搜索 “select”
323 行,enabled 由 false 改为 true。
感觉访问缓慢? 可能是谷歌字体的锅,毕竟这里是~ 哼哼
替换谷歌字体
搜索“fonts.googleapis.com”改为 fonts.geekzu.org
最后就剩你自由发挥了,你可以挂载大容量的GD或OD网盘到目录下,啧啧
网站本身是没法设置密码访问的。如果不想对外开放可通过宝塔设置密码访问
网站管理-设置网站-网站目录-密码访问
宝塔配置教程:
二、安装
要求:PHP 5.5+,本文使用的 PHP7.0
1、搭建网站环境
可使用一键包或者宝塔等面板程序搭建。宝塔面板安装请看官方教程,并在初次安装 LNMP 时注意 PHP 版本。在宝塔面板中新建网站,输入域名;在域名解析商设置对应的解析。
2、获取 h5ai
推荐使用宝塔面板的远程下载功能,通过黑猫云直链:
https://yun.iwyc.cn/TOOLS/PHP/h5ai-0.29.0.zip


在网站目录解压 zip,并删除无关文件,如下图所示:注意,要将_h5ai
文件夹放入网站目录
3. 设置 PHP
在宝塔面板中,进入软件管理,找到 PHP 设置。


修改 php 配置 – 禁用函数,解除禁用函数 scandir、exec 和 passthru。如果禁用列表中有这三个函数,删除即可。
4、修改配置文件
如果你使用的是 Nginx,则只需要复制以下代码:
/_h5ai/public/index.php
在宝塔面板的网站设置中,找到配置文件,以 index 开头的一行,

将代码复制到行末的分号前面,如下图所示:


保存配置文件后,访问域名就可以看到 h5ai 已经搭建成功啦!只需要将文件 / 文件夹上传至网站目录,即可在此处显示。
三、拓展
访问 http://你的域名/_h5ai/public/index.php
进入后台检查,默认密码为空,直接点击 login 进入。

!> 后台检查会列出安装情况,最好都达成 yes!
我们可以找到如下图的拓展,与图片、视频、PDF 在线预览相关。下面我们一一进行配置:

1. PDF 缩略图拓展
安装 imagemagick 即可满足。需要进入 SSH 终端
Ubuntu/Debian 系统:
apt-get install imagemagick -y
CentOS 系统:
yum install ImageMagick -y
如下图所示:

2. EXIF
在宝塔面板找到 PHP 管理(上文提到过哟),安装拓展。

3. 视频缩略图拓展
请自行搜索系统名称+安装 ffmpeg
,例如 Centos6 安装ffmpeg
这个拓展我用不到,所以就不列出教程了。
四、个性化配置
h5ai 提供几项个性化配置,修改配置文件即可实现。配置文件路径是:
_h5ai/private/conf/options.json
可以根据自己的偏好进行探索、设置。下面展示一部分常用的配置:
1. 设置默认语言。
在配置文件中搜索 “l10n” 找到设置,将 en 改为 zh-cn 即可。
"l10n": { "enabled": true, "lang": "zh-cn", "useBrowserLang": true },
2. 开启文件搜索功能。
在配置文件中搜索 “search”,将 false 改为 true。
"search": { "enabled": true, "advanced": true, "debounceTime": 300, "ignorecase": true },
设置好后,h5ai 左上角就有会有一搜索按钮,即可搜索 h5ai 目录里的文件。
3. 打包下载
多文件下载设置需要配置两步。第一步,先配置让 h5ai 支持文件选择(就是复选框喽!)
"select": { "enabled": true, "clickndrag": true, "checkboxes": true },
配置文件中搜索 “download”,将 false 改为 true,如果需要设置打包文件的格式为 zip,而不是默认的 tar 的话,需要将 php-tar 改为 shell-zip。
"download": { "enabled": true, "type": "shell-zip", "packageName": null, "alwaysVisible": false },
4. 信息与二维码
可以通过扫码的方式下载文件。在配置文件中搜索 “info”,将 false 改为 true。
"info": { "enabled": true, "show": true, "qrcode": true, "qrFill": "#999", "qrBack": "#fff" },
当你鼠标置于文件上时,可以看见 h5ai 右侧显示文件类型和二维码,手机扫码就可以下载文件。
五、其他说明
1. 头部与底部说明
在需要显示自定义 HTML 的目录下,添加 _h5ai.headers.html
或_h5ai.footers.html
。通常用于对该目录的一些说明。支持 HTML 标签。
2. 字体加速
h5ai 使用了谷歌字体,如有必要,可以更换为大佬们制作的镜像地址。
打开文件目录:h5ai/private/conf/options.json,找到 resources 项,将 styles 参数中的 fonts.googleapis.com 替换为:
fonts.loli.net
如下图所示:

楼主,搭建完成后怎么上传文件?
慢慢研究下,或者百度搜下教程