Nginx目录浏览并进行美化

Nginx 作为一个高性能的 HTTP 和反向代理 web 服务器,默认不允许列出站点的整个目录,如果需要开启,可以通过配置打开此功能。

此功能一般作为在内网中提供下载文件等功能使用。

配置目录浏览

server {
    listen       80;
    index index.html index.htm;
    server_name dl.qq52o.me;
    root /home/lufei/downloads;
    autoindex on;  # 开启目录浏览功能
    autoindex_localtime on;  # 显示本地时间
    autoindex_format html;  # 输入格式,可选项为html、xml、json、jsonp
    autoindex_exact_size off;  # 显示精确字节大小还是显示友好可读的大小
}

配置完成后重启Nginx,访问配置好的server_name即可看到效果,效果如下:

nginx-autoindex.png

美化目录浏览

Nginx自带的目录浏览功能看起来并不是那么美观,可以使用第三方模块ngx-fancyindex插件来美化目录浏览功能。

我使用的ubuntu,并且 Nginx 也是通过apt安装的

sudo apt install libnginx-mod-http-fancyindex

所以我这里使用了此命令进行了安装,其他系统可以参考 README 进行安装。

安装完成后,启用fancyindex,修改刚才的配置文件

server {
    listen       80;
    index index.html index.htm;
    server_name dl.qq52o.me;
    root /home/lufei/downloads;

    fancyindex on;            # 开启索引功能
    fancyindex_exact_size off; # 关闭文件大小
    fancyindex_localtime on; #开启时间显示
    fancyindex_name_length 255; #最大名字长度
    fancyindex_time_format "%Y-%m-%d %H:%M:%S";
}

重启以后就可以看到效果。

我选择了一个使用 Material Design 元素的响应主题。主题地址:https://github.com/fraoustin/Nginx-Fancyindex-Theme

拉取主题代码:

cd /home/lufei/downloads
git clone https://github.com/fraoustin/Nginx-Fancyindex-Theme.git fancyindex

然后修改配置,加上主题配置:

fancyindex_header "/fancyindex/header.html";
fancyindex_footer "/fancyindex/footer.html";
fancyindex_ignore "fancyindex";

再次重启Nginx,就可以看到最终的效果了:

文章来源于互联网:Nginx目录浏览并进行美化

阅读全文
下载说明:
1、本站所有资源均从互联网上收集整理而来,仅供学习交流之用,因此不包含技术服务请大家谅解!
2、本站不提供任何实质性的付费和支付资源,所有需要积分下载的资源均为网站运营赞助费用或者线下劳务费用!
3、本站所有资源仅用于学习及研究使用,您必须在下载后的24小时内删除所下载资源,切勿用于商业用途,否则由此引发的法律纠纷及连带责任本站和发布者概不承担!
4、本站站内提供的所有可下载资源,本站保证未做任何负面改动(不包含修复bug和完善功能等正面优化或二次开发),但本站不保证资源的准确性、安全性和完整性,用户下载后自行斟酌,我们以交流学习为目的,并不是所有的源码都100%无错或无bug!如有链接无法下载、失效或广告,请联系客服处理!
5、本站资源除标明原创外均来自网络整理,版权归原作者或本站特约原创作者所有,如侵犯到您的合法权益,请立即告知本站,本站将及时予与删除并致以最深的歉意!
6、如果您也有好的资源或教程,您可以投稿发布,成功分享后有站币奖励和额外收入!
7、如果您喜欢该资源,请支持官方正版资源,以得到更好的正版服务!
8、请您认真阅读上述内容,注册本站用户或下载本站资源即您同意上述内容!
原文链接:https://www.shuli.cc/?p=13196,转载请注明出处。
0

评论0

显示验证码
没有账号?注册  忘记密码?