在日常运维中,web的目录服务其实很常见,那么如果想要摆脱枯燥的界面,可以尝试nginx的一款插件,叫Fancyindex,目前该插件可以通过yum形式安装(但需要收费),源码编译方式,整个操作过程不算复杂,目前国内的主流源基本用的都是这一款插件,下图为效果图,如果想要了解如何实现,请往下看吧。
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252154615-1.jpg)
正文
环境
- Web服务:Nginx 1.21.1
- Fancyindex:0.5.1
- 系统版本:CentOS 8.4
准备工作
- yum -y install gcc-++ yum-utils zlib-devel wget vim gcc-c++ pcre-devel zlib-devel make
下载相关软件
1.下载nginx源码包
- wget http://nginx.org/download/nginx-1.21.1.tar.gz
2.下载Fancyindex包
- wget https://github.com/aperezdc/ngx-fancyindex/releases/download/v0.5.1/ngx-fancyindex-0.5.1.tar.xz
解压软件包
- tar -zxvf nginx-1.21.1.tar.gz
- tar -xvf ngx-fancyindex-0.5.1.tar.xz
编译Nginx
- cd nginx-1.21.1
- ./configure --user=nginx --group=nginx --add-module=/root/ngx-fancyindex-0.5.1 --prefix=/usr/local/nginx
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252153a0-2.jpg)
出现这个界面就代表编译完成
- make && make install
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252154161-3.jpg)
编译安装完成
创建目录并修改nginx根目录
- mkdir /kasar
- vim /usr/local/nginx/conf/nginx.conf
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252155H2-4.jpg)
将根修改为/kasar
启动Nginx
- /usr/local/nginx/sbin/nginx
如果出现下图的报错,需要添加nginx用户
- useradd -s /sbin/nologin -M nginx
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252153Z5-5.jpg)
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/22521560N-6.jpg)
启动正常
访问测试nginx是否正常
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/225215JN-7.jpg)
访问正常
如果出现下图问题是由于index.html没有创建
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/225215C40-8.jpg)
开启Fancyindex插件
这里需要注意的是该插件的位置,如果是在http块下面,会将插件应用到整个目录,如果放在location下面,只针对当前目录生效。
- vim /usr/local/nginx/conf/nginx.conf
- fancyindex on;
- fancyindex_exact_size off;
- fancyindex_localtime on;
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/22521563K-9.jpg)
重启nginx服务查看效果
- /usr/local/nginx/sbin/nginx -s reload
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252153E0-10.jpg)
加载模板
1.模板里的内容过多,如果有需要,请留言或私信我。
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252153K3-11.jpg)
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252155643-12.jpg)
2.修改nginx.conf,启用页头页尾
- vim /usr/local/nginx/conf/nginx.conf
- #####启用页头和页尾
- fancyindex_footer /theme/footer.html;
- fancyindex_header /theme/header.html;
- #####忽略页头、页尾和图标文件
- fancyindex_ignore theme;
- #####重启服务
- /usr/local/nginx/sbin/nginx -s reload
查看效果
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/225215J31-13.jpg)
最终效果
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/2252152O5-14.jpg)
![一文学会提高Nginx目录服务、私有镜像仓库目录美观性 一文学会提高Nginx目录服务、私有镜像仓库目录美观性](/uploads/allimg/210801/22521562I-15.jpg)
写在最后
美化的教程可以随意更改为自己想要的内容,目前在github还是有很多模板的,可以自行选择,如果需要大量更改需要一定的前端能力,个人觉得我们自身做出一个差不多的内容就可以了,如果想要做成清华那种,需要花费很大的功夫,可以当做一个项目来做,我们做到提高原始的目录服务美观性即可。
原文链接:https://www.toutiao.com/i6989271454755881480/