使用nginx+fancyindex搭建一个带搜索功能漂亮的目录浏览站点

1.前言：nginx自带目录索引，功能简单、样式也不好看，而且长文件名还显示不全，使用fancyindex插件来做索引，配上一个漂亮的主题还有搜索的功能，使界面看起来赏心悦目。

2.软件版本

web：Nginx 1.14.0
fancy: fancyindex V0.4.3
fancy-theme: fancy v1.1

3.下载并安装包

yum install gcc gcc-c++ wget ntpdate vim-enhanced autoconf automake openssl-devel pcre-devel unzip
wget http://nginx.org/download/nginx-1.14.0.tar.gz
wget -O fancyindex.zip https://github.com/aperezdc/ngx-fancyindex/archive/v0.4.3.zip
wget -O fancytheme.zip https://github.com/Naereen/Nginx-Fancyindex-Theme/archive/master.zip
tar -zxvf nginx-1.14.0.tar.gz
unzip fancyindex.zip
unzip fancytheme.zip

4.编译安装nginx，增加插件模块

cd nginx-1.14.0
./configure --prefix=/usr/local/nginx --add-module=../ngx-fancyindex-0.4.3/
//确定没有错误后，执行make && make install
make && make install
cp -r /root/Nginx-Fancyindex-Theme-master/fancyindex.conf /usr/local/nginx/conf/
cp -r /root/Nginx-Fancyindex-Theme-master/Nginx-Fancyindex-Theme-dark /usr/local/nginx/html/fancydark　　       #黑色主题，选择其中一种即可
cp -r /root/Nginx-Fancyindex-Theme-master/Nginx-Fancyindex-Theme-light /usr/local/nginx/html/fancydark-light　　#白色主题

5.修改html文件引用：cd /usr/local/nginx/html/fancydark 【不然无法读取样式，可以通过styles.css修改页面样式】

6.修改配置文件

vim /usr/local/nginx/conf/nginx.conf

worker_processes 4;

events {
    worker_connections 1024;
}

http {
    include mime.types;
    default_type application/octet-stream;

    sendfile on;
    keepalive_timeout 65;

    server {
        listen 8001;
        server_name localhost;

        location / {
            root html;
            include fancyindex.conf;
        }

        error_page 500 502 503 504 /50x.html;
        location = /50x.html {
            root html;
        }
    }
}

vim /usr/local/nginx/conf/fancyindex.conf

fancyindex on;
fancyindex_localtime on;
fancyindex_exact_size off;
fancyindex_header "/fancydark/header.html";
fancyindex_footer "/fancydark/footer.html";
fancyindex_ignore "fancydark";
fancyindex_name_length 200;

7.验证配置文件并启动nginx

/usr/local/nginx/sbin/nginx -t
/usr/local/nginx/sbin/nginx

8.查看效果