文件目录优化：h5ai

~~先放一个demo给大家康康：~~https://xiabee.cn/files/

有了一个站点，不做点仓库简直对不起自己......但是看着原始那个index的界面，感觉心里硌得慌

丑的有点难受

这个时候有两种解决办法：①手写前端；②套轮子

~~手写前端这里就不介绍了，作为一个合格的WEB狗，相比大家都会写，只是花费的时间......~~

简介

这里简单介绍一下 h5ai

官网地址：https://larsjung.de/h5ai/

h5ai是HTTP Web服务器的现代文件索引器，重点放在您的文件上。目录以吸引人的方式显示，并且通过不同的视图，面包屑和树概述来增强对目录的浏览。最初，h5ai是HTML5 Apache Index的首字母缩写，但现在它也支持其他Web服务器。

有很多可选的扩展名和配置选项，用于自定义目录列表的Web外观。所有标记都是有效的HTML5，并结合了CSS3和最优质的JavaScript，可构建一个新颖但最少的用户界面，并专注于文件的用户体验。
一些可选功能包括：文件排序，不同的视图模式，本地化，面包屑，树视图，自定义页眉和页脚，文件过滤器和搜索，文件夹大小，自动刷新，打包下载，QR码，缩略图，文件预览

~~下载地址：官网自寻~~

本站下载地址：https://xiabee.cn/files/WEB/h5ai-0.29.2.zip

安装

其实直接解压就好了......

官网让我们将_h5ai文件夹复制到Web服务器的文档根目录DOC_ROOT/_h5ai......其实这里还是建议在站点的文件目录下解压_h5ai，~~防止权限分配不当导致站点源代码泄露~~

目录结构大概是这个亚子：

FILES
 ├─ _h5ai
 ├─ your files
 └─ your folders

然后访问自己站点的index，康康有没有回显：http://YOUR-DOMAIN.TLD/_h5ai/public/index.php

正常的回显是这个亚子的：

显示各个功能需要的依赖和版本

配置

解压完成后，需要在默认索引文件列表的末尾添加 /_h5ai/public/index.php

具体方法如下：

nginx：nginx.conf

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

nginx配置文件

Apache httpd ：在httpd.conf或根目录中的.htaccess

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

lighttpd ：lighttpd.conf

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

切诺基：cherokee.conf

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

其他配置内容主要在 _h5ai/private/conf/options.json 中，手动修改即可（~~其实_h5ai/private/conf里面也有一些配置文件~~

权限配置

/_h5ai/public/ 和 /_h5ai/private/ 两个文件夹记得控制一下权限，最好给个755以下的级别~~（不过好像755再往下就直接报错了......~~

或者直接在nginx.conf里面配置一下：

    #允许访问 /files/
    location /files {
        autoindex on;
    }

    # 禁止访问 _h5ai
    location /files/_h5ai {
        deny all;
        return 404;
    }

效果图：https://xiabee.cn/files/WEB/