使用 Nginx 搭建自己的静态资源服务器

最近在学习 Vue 框架，学习过程中需要一个静态资源服务器，故先自己搭建一个供学习使用。

通过 docker 搭建 nginx 服务器

安装命令：

$ brew cask install docker

下载命令：

$ docker image pull nginx

为了保持环境和目录的干净，先在自己期望的位置下创建一个 docker 目录，
然后在 docker 目录下再创建一个 docker_nginx 目录。
之后我们通过命令行进入到 docker_nginx 目录下。

参考官方文档，导出命令如下：

$ docker run --name tmp-nginx-container -d nginx
$ docker cp tmp-nginx-container:/etc/nginx/ conf/
$ docker rm -f tmp-nginx-container

此时我们可以看到当前所在 docker_nginx 目录下多出了一个 conf 文件夹，该文件夹下包含的就是 nginx 的相关配置文件。
其中 nginx.conf 是默认配置文件我们通常不需要修改，conf.d 目录下以 .conf 结尾的都是自定义配置文件，我们可以根据需要创建或修改。

为了可以直接在浏览器中看到资源文件目录，我们需要在本地拷贝下来的 docker_nginx/conf/conf.d/default.conf 配置文件中进行一个小修改，
即在配置文件的 server {…} 中新增一个配置：

autoindex    on;

注意，为了安全在线上时不要开启上述配置。

在 docker_nginx 下我们先创建一个 content 目录，然后将存放资源文件的文件夹放在 content 目录下，
练习时可在 content 目录下随意创建一些文件夹和文件。

我们有两种方式创建此次要用到的 nginx 容器

我们可以通过 docker run 命令直接创建并启动容器：

$ docker run -d \
    -p 80:80 \
    -v $PWD/content:/usr/share/nginx/html:ro \
    -v $PWD/conf:/etc/nginx:ro \
    --name my-nginx \
    nginx

命令执行成功后通过 docker container ls 命令可以看到创建成功的 my-nginx 容器。

我们先在 docker_nginx 目录下新建 Dockerfile 文件，再在 Dockerfile 文件中添加如下内容：

FROM nginx
COPY content/ /usr/share/nginx/html/
COPY conf/ /etc/nginx/

然后我们可以使用创建好的 Dockerfile 构建一个自定义 nginx 镜像，命令行切换到 docker_nginx 目录，构建命令如下：

$ docker build -t nginx-custom .

命令执行成功后通过 docker image ls 命令可以看到创建成功的 nginx-custom 镜像。

最后我们可以通过更简洁的 docker run 命令创建并启动容器：

$ docker run -d -p 80:80 --name my-nginx nginx-custom

现在，通过在浏览器地址栏输入 http://localhost/ 我们可以直接看到资源文件目录:

未完待续。。。