h5ai-轻量目录列表程序(支持图文预览)

介绍

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

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

 

一、特征

有很多可选的扩展名和配置选项,用于自定义目录列表的Web外观。所有标记都是有效的HTML5,并结合了CSS3和最优质的JavaScript,可建立一个新颖但最少的用户界面,并专注于文件的用户体验。

一些可选功能包括:文件排序,不同的视图模式,本地化,面包屑,树视图,自定义页眉和页脚,文件过滤器和搜索,文件夹大小,自动刷新,打包下载,QR码,缩略图,文件预览

二、安装

使用宝塔演示。

1.环境检查

1.安装之前,我们需要在php中安装ImageMagick、fileinfo、exif扩展。

宝塔: php管理-安装扩展

2.将文件夹复制_h5ai到Web服务器的文档根目录:wwwroot/_h5ai

结构:
wwwroot
 ├─ _h5ai
 ├─ your files
 └─ and folders

3.访问http://域名(或IP)/_h5ai/public/index.php,检查h5ai是否可以访问。

注:无初始密码,直接点击登录

此页面显示有关服务器功能的一些提示。


4.还需要设置下,添加 /_h5ai/public/index.php 到默认的首页列表中. 以下是Apache、Nginx等修改配置的方法:

Apache httpd 2.2/2.4: inhttpd.confor in the root directory's.htaccessfile set for example:

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

lighttpd 1.4: inlighttpd.confset for example:

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

nginx 1.2: innginx.confset for example:

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

Cherokee 1.2: incherokee.confset for example:

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

宝塔面板设置:

网站--默认文档--添加一行   /_h5ai/public/index.php  

添加好之后,访问域名(或IP)

 

自定义安装

可以将h5ai安装到Web服务器文档根目录的任何子目录中。当显示面包屑等时,此目录将被视为根目录。

例如,将文件夹复制_h5aiDOC_ROOT/some/folder/_h5ai

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

参观http://域名(或IP)/some/folder/_h5ai/public/index.php,看看是否一切正常。在此示例中,还是需要添加/some/folder/_h5ai/public/index.php到索引文件列表中。

 

配置文件修改

主要配置文件是_h5ai/private/conf/options.json。您可能需要更改某些记录的设置。但是,_h5ai/private/conf您可能需要查看更多文件。

三、提示

  • 不支持Web服务器特定的功能,包括访问限制!使限制区域正常工作和保护的最佳机会可能是将文件夹_h5ai完全放在受限制的区域内。需要您自担风险使用它!
  • 通常不适用于别名文件夹(在Apache httpd中可用)。别名文件夹使不可能将URL映射到文件系统文件夹。
  • 如果未显示任何图标,则可能是您必须将SVG MIME类型添加到服务器。
  • 在Ubuntu服务器上,您可能需要安装其他软件包以支持PHP JSON
 

四、可能遇到的问题

1.打开网站提示“[ERR] h5ai sources must be preprocessed to work correctly”

应该是直接用github上源码的了,那个需要用npm编译,建议去作者网站直接下载。

2.h5ai运行异常。

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

要使用基于shell命令的可选功能execpassthru必须使用PHP函数,并且不能禁用它php.ini(重启php)

宝塔删除方法: php管理-禁用函数-删除  (重启php)

3.h5ai缩略图问题。

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

 

五、下载

作者博客:https://larsjung.de/h5ai/  直接点击右边的版本下载

官网最新下载:https://release.larsjung.de/h5ai/

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

 

六、其他依赖问题

访问http://域名(或IP)/_h5ai/public/index.php  ,出现如下问题。

 

解决:

CentOS7 安装FFmpeg 或 libav:

请查看FFmpeg官方最新版本:https://ffmpeg.org/releases/

1.升级系统

sudo yum install epel-release -y
sudo yum update -y
sudo shutdown -r now

2.安装Nux Dextop Yum 源

由于CentOS没有官方FFmpeg rpm软件包。但是,我们可以使用第三方YUM源(Nux Dextop)完成此工作。

1.sudo rpm --import http://li.nux.ro/download/nux/RPM-GPG-KEY-nux.ro
2.sudo rpm -Uvh http://li.nux.ro/download/nux/dextop/el7/x86_64/nux-dextop-release-0-5.el7.nux.noarch.rpm

3.安装FFmpeg 和 FFmpeg开发包

sudo yum install ffmpeg ffmpeg-devel -y

测试是否安装成功

ffmpeg

如果你想了解更多关于FFmpeg使用方面的资料,可以输入:

ffmpeg -h


4. 略微图功能

图片:

将 _h5ai 中,private 与 public 文件夹中的 cache 目录设置权限为 755。

EXIF:

直接用宝塔面板安装PHP,在PHP扩展选项里选择 Exif模块安装

PDF 略缩图:

宝塔面板PHP扩展里找到ImageMagick 安装

5.H5ai其他功能

以下不专门注明的话,都是在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
},

3.多文件下载支援设置。

3.1在配置文件中搜索select,将false改为true。之后你的h5ai点击文件先端的时候,并不是下载,而是选中文件,下载的按钮呢在左上角喽。如果要下载文件呢,可以点击文件名字依旧还是下载功能。

"select": {
"enabled": true,
"clickndrag": true,
"checkboxes": true
},

3.2在配置文件中搜索download,将false改为true,如果需要设置打包文件的格式为zip,而不是默认的tar的话,需要将php-tar改为shell-zip。

"download": {
"enabled": true,
"type": "shell-zip",
"packageName": null,
"alwaysVisible": false
},

4.二维码下载

可以通过扫码的方式下载文件。在配置文件中搜索info,将false改为true,这里有2个地方要改。

"info": {
"enabled": true,
"show": true,
"qrcode": true,
"qrFill": "#999",
"qrBack": "#fff"
},

当你鼠标置于文件上时,可以看见h5ai右侧显示文件类型和二维码,手机扫码就可以下载文件。

5.加密

首先生成自定义 sha512 密码:http://md5hashing.net/hashing/sha512
然后搜索 passhash,大概第 10 行,将其密码改成自己生成的。


说明:

本文部分内容来自:

大鸟原文

雨林原文

因安装过程中,不同环境与操作往往会造成不同的问题,此文章总结记录安装中遇到的问题。

 

版权声明:
作者:散逸
链接:https://eee.run/2021-01-29/620.html
来源:散逸-博客-导航
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
< <上一篇
下一篇>>
文章目录
关闭