Nginx做静态资源服务器是一个十分基础的应用了，但是一般默认是不会将静态资源的目录直接列出来的。不过要想直接列出目录内的文件，做一个目录文件列表也是他原生的功能，配置也十分简单，只需要配置autoindex项即可。
一般在网络上很容易见到的一些资源站、下载站之类的、甚至是某些镜像站，也是通过配置nginx的autoindex实现的，如下图页面
163_mirror_autoindex

autoindex配置

配置项相关

autoindex项的默认值是off，开启目录列表只需要在server或者location块里配置autoindex on;即可
我下面的示例是会在location路由块里配置，主要还是觉得在location块里设置会比较好

当然除了配置autoindex项之外，还有一些其他的配置项，如下表

配置项	值	描述
autoindex	on / off	默认 off，不开启目录浏览 on,开启目录浏览
autoindex_exact_size	on / off	默认 on，精确文件大小显示，单位Bytes 推荐 off，文件大小显示使用KB/MB/GB单位估算显示
autoindex_format	html / xml / json / jsonp	目录列表的显示格式默认 html
autoindex_localtime	on / off	默认 off，显示的文件时间为GMT时间 on，显示的文件时间为文件的服务器时间

这里还需要配置charset使目录支持中文显示，否则中文文件名会产生乱码
charset utf-8,gbk;

这里贴出一段示例的配置

location /dl/ {
    root /home/flyky/fileindex/;
    charset utf-8;

    autoindex on;
    autoindex_exact_size off;
    autoindex_format html;
    autoindex_localtime on;
}

关于 root 与 alias

上面示例配置中，列出的目录在主机上的位置是/home/flyky/fileindex/dl/
上面使用的是root指令来配置服务请求的根目录，因为要列出的是fileindex下的dl目录，所以在root项中应该配置dl所在的fileindex目录为根目录，然后在location配置dl目录的路由
也就是说，root配置的是资源的根目录，是所要做文件列表展示的目录的『所在目录』或者说是『上层目录』，而不是被展示列表的那个目录，并且要确保location路由的目录，也就是目录dl在fileindex目录下

当然，上面说得这么绕，还有一种情况，使用alias就好理解一点了
alias即别名，也就是给服务请求的目录起了一个别名，譬如配置/home/flyky/fileindex/dl/的目录的路由为/download，我们可以这样写

location /download/ {
    alias /home/flyky/fileindex/dl/;
    autoindex on;
}

假设server为localhost，监听8080端口，这里我们访问localhost:8080/download/浏览到的就是dl目录，之后访问的uri内所有的/download/都会被替换成/home/flyky/fileindex/dl/目录，相当于是给dl目录起了个别名download，也有点类似与linux里的目录软链接
但是这里有个坑，由于这个alias实际是用的“替换”路径，所以在配置location项的路由名后面一定要加上/，比如上面例子的/download/，如果不加上斜杠的话，比如要访问主机dl/test.png图片资源，那在浏览器中应该访问的地址是servername:port/dowload/test.png，服务器访问会被替换成dltest.png，一定会报404 not found的。
当然如果使用root设置根目录的话就没必要后添斜杠了，location配置直接/download就可以

其他

注意访问的目录权限，如果nginx无法访问到该目录报了403 forbidden错误的话，大概率是权限问题
查看配置的目录的访问权限以及所有者，启动nginx的用户是否可以访问该目录
另外最好不要设置访问/root，普通用户无法访问root目录下的文件，如果一定要设置root目录或者其他root用户权限目录下的目录，可以更改nginx的配置文件，将user项配置成root用户。

autoindex页面的美化

配置好的autoindex页面效果极度简洁，并不美观，如果想要赏心悦目那必定还得一番折腾

安装 ngx-fancyindex 插件

首先需要给Nginx安装ngx-fancyindex插件，安装方法还是编译安装，之前的博文已经具体写过nginx编译安装了，这里也不赘述了。这里只描述给已安装的nginx添加插件的过程

使用2>&1 nginx -V | tr ' ' '\n'|grep module命令可以查看当前nginx编译安装好的模块

首先在nginx源码包目录下下载解压插件ngx-fancyindex源码，直接git clone也好

1	git clone https://github.com/aperezdc/ngx-fancyindex.git ngx-fancyindex

然后将 --add-module=ngx-fancyindex \ 添加到configure配置中执行configure
如果没有用Nginx编译安装指北这篇博文里的configure脚本的话，可以使用nginx -V，可以查看到当初安装nginx的configure参数配置。

configure执行后make编译，编译结束后不需要make install了（当然如果你还没有安装nginx的话直接make install就可以了）
进入nginx源码目录下的objs目录，可以看到编译好的nginx可执行程序文件
首先执行2>&1 ./nginx -V | tr ' ' '\n'|grep fan查看是否编译了插件，没问题了之后再把objs/nginx复制替换到安装位置的nginx就可以了，我的configure参数设置了sbin-path为/usr/sbin/nginx,所以我只需要把objs下的nginx复制到/usr/sbin/即可。

fancyindex主题安装配置

插件安装好之后就可以使用fancyindex主题了。
去github搜fancyindex-theme就能看到很多别人写好的主题，随便选一个，然后根据文档进行配置即可

因为根据不同的主题可能有不同的安装方法，我就不详细讲关于主题的安装配置了

我这里是使用的是Naereen/Nginx-Fancyindex-Theme，也有使用文档
使用效果如图
autoindex_flyky

其实主题安装配置过程讲起来也就几步

首先下载主题解压到网站根目录，或者git clone到网站根目录
然后在nginx的配置autoindex的location块中引入fancyindex配置文件
include /your/website/root/fancyindex.conf
之后你也可以修改fancyindex配置文件，譬如我使用的这个主题可以配置light或dark两种配色主题等

这里要注意主题要放在网站根目录，同时也要配置好location /的路由

参考资料

Nginx浏览目录配置及美化