我们在做一些文件服务器的时候,偶尔会考虑使用http来搞,虽然说默认的也ok,但是长得有点丑,怎么办呢? 一个字干!!
首先你的网站长这个屌样子
原始
别人家网站长的比你好看
ngx-fancyindex
怎么搞呢?非常简单
装nginx么,谁不会,是不是?嘿嘿嘿,多加一个模块而已,我们开始。
首先git拉一下ngx-fancyindex的模块
[root@localhost home]# git clone https://github.com/aperezdc/ngx-fancyindex.git
Cloning into 'ngx-fancyindex'...
remote: Enumerating objects: 14, done.
remote: Counting objects: 100% (14/14), done.
remote: Compressing objects: 100% (12/12), done.
remote: Total 755 (delta 3), reused 4 (delta 0), pack-reused 741
Receiving objects: 100% (755/755), 223.81 KiB | 107.00 KiB/s, done.
Resolving deltas: 100% (429/429), done.
[root@localhost home]#
然后么,开始安装
[root@localhost home]# tar xvf nginx-1.10.1.tar.gz
[root@localhost home]# cd nginx-1.10.1/
[root@localhost nginx-1.10.1]# useradd -s /sbin/nologin -M www
[root@localhost nginx-1.10.1]# ./configure --user=www --group=www --add-module=../ngx-fancyindex/ --prefix=/home/nginx --with-http_stub_status_module --with-http_ssl_module
[root@localhost nginx-1.10.1]# make && make install
安装完成后,我们搞套索引主题来
先随便进个目录,然后git上拉个索引主题
[root@tmp-20180522-sys-kvm-c-03-890525692825 tmp]# git clone https://github.com/Naereen/Nginx-Fancyindex-Theme.git
Cloning into 'Nginx-Fancyindex-Theme'...
remote: Enumerating objects: 182, done.
remote: Total 182 (delta 0), reused 0 (delta 0), pack-reused 182
Receiving objects: 100% (182/182), 654.20 KiB | 131.00 KiB/s, done.
Resolving deltas: 100% (81/81), done.
[root@tmp-20180522-sys-kvm-c-03-890525692825 tmp]#
[root@tmp-20180522-sys-kvm-c-03-890525692825 tmp]# tree Nginx-Fancyindex-Theme/
Nginx-Fancyindex-Theme/
├── _config.yml
├── fancyindex.conf
├── HEADER.md
├── LICENSE
├── Nginx-Fancyindex-Theme-dark
│ ├── addNginxFancyIndexForm.js
│ ├── footer.html
│ ├── header.html
│ ├── jquery.min.js
│ ├── showdown.min.js
│ └── styles.css
├── Nginx-Fancyindex-Theme-light
│ ├── addNginxFancyIndexForm.js
│ ├── footer.html
│ ├── header.html
│ ├── HEADER.md
│ ├── jquery.min.js
│ ├── README.md
│ ├── showdown.min.js
│ └── styles.css
├── README.md
└── screenshots
├── Nginx-Fancyindex-Theme__example1.png
├── Nginx-Fancyindex-Theme__example2.png
├── Nginx-Fancyindex-Theme__example3.png
├── Nginx-Fancyindex-Theme__example4.png
├── Nginx-Fancyindex-Theme__example5.png
└── Nginx-Fancyindex-Theme__example6.png
3 directories, 25 files
[root@tmp-20180522-sys-kvm-c-03-890525692825 tmp]#
下载主题后,我们看到里面有2套,一套黑色,一套白色分别是
Nginx-Fancyindex-Theme-dark
Nginx-Fancyindex-Theme-light
然后将主题拷贝到网站目录下
[root@tmp-20180522-sys-kvm-c-03-890525692825 tmp]# mv Nginx-Fancyindex-Theme/Nginx-Fancyindex-Theme-light /home/webapp/
然后配置下nginx,注意看下配置文件中的索引html指向
[root@localhost conf]# cat nginx.conf
worker_processes auto;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
fancyindex on;
fancyindex_exact_size off;
fancyindex_localtime on;
fancyindex_header "/Nginx-Fancyindex-Theme-light/header.html";
fancyindex_footer "/Nginx-Fancyindex-Theme-light/footer.html";
fancyindex_ignore "examplefile.html";
fancyindex_ignore "Nginx-Fancyindex-Theme-light";
fancyindex_name_length 255;
server {
listen 80;
server_name localhost;
location / {
root /home/webapp/;
index index.html index.htm;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}
配置完成后,启动nginx 嗨吧