h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

在线应用3字数 2255阅读模式

h5ai是一款功能强大 php 文件目录列表程序,不需要数据库,支持在线预览文本、图片、音频、视频等。和昨天分享的Directory Lister又有不同,h5ai可以满足更多的应用场景。

h5ai功能包括:文件排序,不同视图模式,本地化,面包屑,树视图,自定义页眉和页脚,文件过滤器和搜索,文件夹大小,自动刷新,打包下载,QR码,缩略图,文件预览,额,这么多功能是不是有点期待,这篇文章大鸟分享下利用宝塔面板来安装h5ai方法以及如何使用。

一:h5ai介绍

h5ai要求PHP 5.5+ 。兼容Apache httpd, lighttpd, nginx 和 Cherokee. 在Chrome, Firefox, Opera, Vivaldi, Safari and Edge上可以获得最佳体验。

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

官网:https://larsjung.de/h5ai/

github:https://github.com/lrsjng/h5ai

二:安装

2.1web环境检查

在宝塔面板安装之前,我们需要在php中安装ImageMagick、fileinfo、exif扩展。

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

我们可以在官网下载安装,也可以在github上下载,不过官网打开貌似不稳定,也可以在大鸟这里下载。我们下载程序包,解压然后将_h5ai 上传到网站根目录: DOC_ROOT/_h5ai.额,宝塔面板用户,直接就可以远程下载了。

DOC_ROOT
 ├─ _h5ai
 ├─ your files
 └─ and folders

额,看着有点费劲,可以看图:

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

打开 http://www.daniao.org/_h5ai/public/index.php, 检查一下h5ai 是否可以访问. 同时,如果你的服务器有不兼容的话这里会显示。不过打开的时候,会要求你设置一个密码,当然留空也可以直接访问,如图:

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

登录之后,会有web环境检查的结果,如图:

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

 

2.2设置

当然到这一步了,还没有安装好,我们还需要设置下,添加 /_h5ai/public/index.php 到默认的首页列表中. 以下是Apache、Nginx等修改配置的方法:

Apache httpd 2.2/2.4: in httpd.conf or in the root directory’s .htaccess file set for example:

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

lighttpd 1.4: in lighttpd.conf set for example:

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

nginx 1.2: in nginx.conf set for example:

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

Cherokee 1.2: in cherokee.conf set for example:

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

如果我们是宝塔面板可以这样在网站设置→默认文档里面添加/_h5ai/public/index.php,如图:

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

 

添加好之后,我们就可以打开浏览器访问了,界面如下:

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

三:h5ai使用与问题

3.1密码

h5ai默认的是空密码,你可以在_h5ai/private/conf/options.json.中修改。h5ai其它的一些配置,例如字体、CSS、标题等都可以在options.json进行修改。

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

3.2目录修改

因为h5ai还是有很多人在使用的,所以默认的_h5ai这个目录我们可以修改一下,比如大鸟这里修改成
h5ai,这样的话,我们需要修改2个地方:

一个是网站默认文档,网站设置→默认文档里面添加为/h5ai/public/index.php 。要去掉前面的下滑线。

其次我们还需要修改h5ai/private/conf/options.json如图:

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

箭头所指的地方要修改和你目录一样的名字。

3.3一些异常

h5ai运行异常。可以尝试将php.ini中的scandir exec passthru三个函数删除,将private和public两个文件夹中的cache目录权限设置为777。

h5ai缩略图问题。需要配置好PHP的exif模块、ffmpeg、ImageMagick等组件。推荐使用宝塔面板,自带了ImageMagick、fileinfo PHP Extension等一键安装,

四:功能介绍

h5ai支持直接在线查看PDF、TXT、PHP、sh。doc不能在线阅读,只可以下载。

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

可以在线观看视频,如图:

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

可以在线预览图片,如图:

h5ai-轻便又美观目录列表程序支持在线预览文本、图片、音频、视频等

五:总结

和Directory Liste的极简风格相比,h5ai平时使用起来则更让我们感到惊喜,同样的极简风格,但是h5ai则更加强大,和Directory Liste相比,大鸟更喜欢使用h5ai。

演示地址:https://larsjung.de/h5ai/demo/

另外说下,白蛇-缘起,没看过的可以去看看,实在是让人感到惊喜的一部动漫!

下载信息 h5ai 0.29.2 118K
最近更新2019-4-12
下载地址 查看演示

weinxin
我的微信
微信公众号
关注大鸟博客公众号
 最后更新:2019-4-12
大鸟
评论  3  访客  3
    • 缙哥哥
      缙哥哥 7

      好复杂的赶脚!

        • 大鸟
          大鸟

          @ 缙哥哥 说实话,不复杂,只是需要设置下/_h5ai/public/index.php就好,其他都不用你动。话说你昨天网站怎么了?

        • divib
          divib 0

          头网址怎么改自定义名称?
          txt之类的 预览下,怎么可选着复制文字?

        匿名

        发表评论

        匿名网友

        :?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

        确定