h5ai 是一款功能强大的 PHP 文件目录列表程序，它提供多种文件目录列表呈现方式，支持 Apache、lighttpd、nginx、Cherokee 服务器，支持多国语言（有中文）。
你可以在线预览文本，图片，音频，视频等文件格式，以及打包下载，显示文件二维码等。

Head Pic: 「第一回シストチャレンジ！」/「凍咲しいな」のイラスト [pixiv]

h5ai

官网：https://larsjung.de/h5ai/
演示：https://larsjung.de/h5ai/demo/

本站演示：https://files.lolico.moe/

环境要求

Apache / lighttpd / nginx / Cherokee 服务器
PHP 5.5+

下载

进入官网直接点击右侧的“DOWNLOAD”即可。
你也可以直接访问 https://release.larsjung.de/h5ai/ 来查看所有可供下载的版本（这一下载站点也运用了 h5ai）。

部署

将下载好的压缩包上传到服务器，解压，将其中的_h5ai文件夹放到网站根目录。

当然，如果你只想让某个子目录使用 h5ai 的话，你可以放到任意一个你想的子目录中。

修改服务器配置：修改默认文档
其实就是在站点默认文档中加入/_h5ai/public/index.php这一项

Apache: httpd.conf或者网站根目录的.htaccess

1
DirectoryIndex  index.html  index.php  /_h5ai/public/index.php

lighttpd 1.4: lighttpd.conf

1
index-file.names += ("index.html", "index.php", "/_h5ai/public/index.php")

nginx 1.2: nginx.conf

1
index  index.html  index.php  /_h5ai/public/index.php;

Cherokee 1.2: cherokee.conf

1
vserver!1!directory_index = index.html,index.php,/_h5ai/public/index.php

禁止/_h5ai/private中的内容被访问
此目录下的文件不宜泄露，因此需要配置服务器以禁止此目录下的文件被访问。
这里拿 nginx 的配置来做示例。
在 nginx 当前网站的配置中加上以下内容：
```
1
2
3
location ~ ^/_h5ai/private/ {
    return 404;
}
```
如果在子目录中部署的话，前面要加上子目录的路径。

注意事项

如果发现无法正常使用，检查 PHP 禁用函数，不能禁用exec、passthru、scandir。
如果排除了上面这个问题，仍然不能显示文件，请检查你的站点根目录中是否有创建站点时自动生成的index.html之类的默认首页文件，请删除。
在 _h5ai 中不会显示任何以.开头的隐藏文件/文件夹，也不会显示任何以_h5ai开头的文件/文件夹。
你也可以用正则表达式自定义不显示的文件/文件夹，这里在后面会讲，这可以用来保护隐私。
不要使用目录别名（例如 Apache / nginx 的 alias），这会使 h5ai 无法得到目录下文件的地址。
如果网页中的图标没有显示，说明你需要向服务器中添加SVG MIME-type。
在 Ubuntu 上你可能需要额外安装PHP JSON支持包。

配置文件

h5ai 的配置文件位于/_h5ai/private/conf/options.json

此处只讲一些比较重要的常用配置，如果你想折腾其他设置的话，我相信你也一定能看懂配置文件里简单的鸟语（。

配置仅作解释，请勿照抄，根据自己实际需求更改true或者false等。

浏览相关

1
2
3
4
5
6
7
8
9
10
11
12
13
"view": {
    //为true的话，用1024进制来计算文件大小
    "binaryPrefix": true,
    ...
    //隐藏名字与这些正则表达式匹配的文件/文件夹
    "hidden": ["^\\.", "^_h5ai"],
    ...
    //如果目录里存在这些文件之一则不应用 _h5ai 来管理文件
    //（即用于点击目录直接打开网站之类的）
    "unmanaged": ["index.html", "index.htm", "index.php"],
    //是否在新窗口中打开上面提到的这种目录
    "unmanagedInNewWindow": false
},

自定义页头页脚

1
2
3
"custom": {
    "enabled": true
},

开启之后，可以自定义页头页脚。

当你打开一个目录后，_h5ai 会检测当前目录中是否含有_h5ai.header.html和_h5ai.footer.html，如果有的话则会当做页头/页脚显示。

如果找不到这两个文件，则会在当前目录或者依次去父级目录中寻找_h5ai.headers.html和_h5ai.footers.html这两个文件，如果有的话，则会当做页头/页脚显示。

这个机制很简单，其实就是带s的就可以让本目录及子目录都显示这个页头/页脚，但是不带s的具有更高的优先级。

开启批量下载

如果要开启批量下载功能，还需要启用多选功能。

1
2
3
4
5
6
7
8
9
10
"download": {
    //是否启用批量下载
    "enabled": false,
    //批量打包方式，可选"php-tar", "shell-tar", "shell-zip"
    "type": "php-tar",
    //打包后的压缩包的名字，为 null 的话就使用当前目录的名字
    "packageName": null,
    //是否始终显示下载按钮
    "alwaysVisible": false
},

开启文件地址二维码

1
2
3
4
5
6
7
8
9
10
11
12
"info": {
    //是否允许显示信息侧边栏
    "enabled": true,
    //是否默认显示侧边栏
    "show": true,
    //是否显示二维码
    "qrcode": true,
    //二维码前景色
    "qrFill": "#999",
    //二维码背景色
    "qrBack": "#fff"
},

设置默认语言为中文

1
2
3
4
5
6
7
8
"l10n": {
    //用户是否可以自行选择语言
    "enabled": true,
    //默认语言，"zh-cn"为简体中文，其他支持的语言可以到"/_h5ai/conf/l10n"中查看
    "lang": "zh-cn",
    //根据浏览器自动判断语言
    "useBrowserLang": true
},

启用搜索功能

1
2
3
4
5
6
7
8
9
"search": {
    //是否启用搜索
    "enabled": true,
    //是否开启进阶搜索（需要开启"filter"设置项，具体请自行研究）
    "advanced": true,
    "debounceTime": 300,
    //是否忽略例外
    "ignorecase": true
},

启用多选功能

1
2
3
4
5
6
7
8
"select": {
    //是否启用多选
    "enabled": false,
    //是否启用拖拽式多选
    "clickndrag": true,
    //是否启用多选框
    "checkboxes": true
},

版权声明：本文为原创文章，版权归神代綺凜所有。
本文链接：https://moe.best/yoimono/h5ai.html
所有原创文章采用知识共享署名-非商业性使用 4.0 国际许可协议进行许可。
您可以自由的转载和修改，但请务必注明文章来源并且不可用于商业目的。

[h5ai]轻便但强大的PHP文件目录列表程序

标题

标题链接

正文