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

作者: 潘峰 / 2020-07-26 / 分类: Notes

提效工具, 服务配置

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

通过 docker 搭建 nginx 服务器

安装 docker (以 HomeBrew 为例):

安装命令:

$ brew cask install docker

下载 nginx 镜像

dockerhub nginx 主页地址

下载命令:

$ docker image pull nginx

导出 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 容器。

方式二:(Dockerfile 方式)

我们先在 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

通过访问 nginx 服务器查看资源

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

添加 HTTPS 支持

未完待续。。。