【h5ai】CentOS6 部署h5ai 并集成ownCloud文件上传功能

h5ai 是一款功能强大 php 文件目录列表程序,不需要数据库,支持在线预览文本、图片、音频、视频等。它的功能包括:文件排序,不同视图模式,本地化,面包屑,树视图,自定义页眉和页脚,文件过滤器和搜索,文件夹大小,自动刷新,打包下载,QR码,缩略图,文件预览等。它支持直接在线查看PDF、TXT、PHP、sh。doc不能在线阅读,只可以下载。

1. 环境准备

h5ai是php开发的,需要挂在已经运行web服务的服务器(Apache/Nginx)上。我们的机器环境是php-5.6 + Apache-2.4。不会安装的可以使用yum安装,yum会把所有的依赖和关系都自动弄好,比自己源码编译省事。

注意:h5ai要求的php最低版本是php-5.5,php版本选择时特别注意。

2. 安装h5ai

去官网下载最新的版本,解压到服务器的DOC_ROOT下(yum安装的Apache,默认的DOC_ROOT 是 /var/www/html)

$ pwd
/var/www/html
$ wget https://release.larsjung.de/h5ai/h5ai-0.29.2.zip 
$ sudo unzip h5ai-0.29.2.zip
$ ls -ltr
total 132
drwxr-xr-x 2 root root   4096 Oct 12  2017 html
drwxr-xr-x 2 root root   4096 Oct 12  2017 cgi-bin
-rw-r--r-- 1 root root 121178 Aug  5 18:46 h5ai-0.29.2.zip
drwxr-xr-x 4 root root   4096 Aug  5 18:47 _h5ai
$ sudo chown daemon:daemon -R h5ai/

3. 配置Apache

修改Apache配置文件
$ sudo vi /etc/httpd/conf/httpd.conf 
把index.php /_h5ai/public/index.php加到DirectoryIndex列表的最后面
DirectoryIndex index.html index.php /_h5ai/public/index.php

保存关闭后,重启Apache,使用浏览器访问http://YOUR-DOMAIN.TLD/_h5ai/public/index.php,可以看到h5ai的登录页面

默认的密码是空,直接点击login进去的是h5ai的一个功能自检页面,可以看到服务器已有的一些扩展和依赖,满足这些扩展组件能使用更多功能。扩展组件的安装百度可以搜到,一个一个对照安装,变成绿色就是成功了。

 

4. 权限设置

分别修改_h5ai下的public和private文件夹里的cache文件夹权限

$ pwd
/var/www/html/_h5ai
$ sudo chmod 666 public/cache
$ sudo chmod 666 private/cache

5. 其他参数配置

h5ai的主配置文件是_h5ai/private/conf/options.json,也有更多设置在"_h5ai/private/conf"中自行修改。

修改首页标题是在_h5ai/private/php/pages/index.php修改<title>标签里面的内容。

打开搜索功能、打开下载功能等都在_h5ai/private/conf/options.json。

对我来说最重要的一个是使用本地字体,因为我的机器在公司内网,不能联网访问网络字体。所以参照了另外一篇博客里面的解决方案,将google字体下载到本地,并且配置h5ai使用本地服务器字体:

在h5ai的_h5ai/public/ext/目录下新建shell脚本fonts.sh,内容如下

#!/bin/bash

ext_dir="/var/www/html/_h5ai/public/ext"

# 将谷歌字体的 css 下载到 _h5ai/public/ext 下
curl -sL -H "User-Agent:Mozilla/5.0 (X11; Linux x86_64; rv:69.1) Gecko/20100101 Firefox/69.1" \
         -o "$ext_dir/fonts.google.css" \
         "https://fonts.googleapis.com/css?family=Ubuntu:300,400,700%7CUbuntu+Mono:400,700"

# 将 css 文件里的所需的字体下载至 _h5ai/public/ext/fonts 下
# 并将 css 文件里字体的路径更改为 _h5ai/public/ext/fonts
mkdir -p "$ext_dir/fonts"
if [ -d "$ext_dir/fonts" ]; then
    cd "$ext_dir/fonts"
    wget $(grep "https" "$ext_dir/fonts.google.css" | awk -F '[()]' '{print $6}')
    sed -i 's|https://.*/|/_h5ai/public/ext/fonts/|' "$ext_dir/fonts.google.css"
fi

赋予fonts.sh文件可执行权限,并运行。运行之后,google字体被下载到fonts.sh脚本所在的目录下

$ pwd
/var/www/html/_h5ai/public/ext
$ chmod +x  fonts.sh
$ ./fonts.sh
$ ls -ltr 
total 24
-rw-r--r-- 1 root root  170 Mar 22  2019 README.md
-rwxr-xr-x 1 root root  777 Aug 17 10:34 fonts.sh
drwxr-xr-x 2 root root 4096 Aug 17 10:35 fonts
-rw-r--r-- 1 root root 9595 Aug 17 10:35 fonts.google.css 

修改h5ai配置文件,使用本地字体

$ vi /_h5ai/private/conf/options.json 
修改
"resources": {
        "scripts": [],
        "styles": [
            "fonts.google.css"
        ]
    },

同样是保存后重启Apache,h5ai就可以使用本地服务器字体了。

 

6. 集成ownCloud文件上传功能

这可能是最好玩的事情了,h5ai是一个文件目录列表程序,文件在线预览和分享非常强大,可是文件上传的问题一直没想到比较好的解决方案。碰巧的是,我安装h5ai的服务器同时运行着一个本地部署的ownCloud云盘,ownCloud对文件的上传可是相当友好的。于是突发奇想,把_h5ai整个挪到ownCloud其中一个用户的数据文件夹下,使用ownCloud的界面做文件上传,再用h5ai来在线预览,完美。

步骤也很简单:

1)  把_h5ai文件夹搬到ownCloud指定用户的数据文件夹下

2) 修改Apache配置文件里DirectoryIndex的-h5ai路径,使用绝对路径

有人会说有ownCloud为什么还要h5ai,我是因为不想要文件从每个人电脑这里上传那里下载,想找一个可以在线预览各种格式文件的工具,比如axure导出的htm原型不能在ownCloud里直接预览,ownCloud对其他一些格式的文件在线预览功能需要插件支持,不免费...等等等等。为什么要集成ownCloud,因为我恰巧有ownCloud。

©️2020 CSDN 皮肤主题: 深蓝海洋 设计师:CSDN官方博客 返回首页