使用docker-compose部署Nginx反向代理

1、环境

• 操作系统：Centos 7
• docker 版本：19.03.7
• docker-compose 版本：1.24.0
• 容器中Nginx 版本：1.17.9

2、目录结构

$ tree -L 2
.
├── conf.d
│   └── webui.conf
├── docker-compose.yml
├── Dockerfile
└── static
    ├── 50x.html
    ├── index.html
    ...

其中，conf.d目录放置Nginx反向代理的配置文件，static中为web的静态资源文件。

3、各个配置文件定义如下：

3.1 webui.conf

# For more information on configuration, see:
#   * Official English Documentation: http://nginx.org/en/docs/
#   * Official Russian Documentation: http://nginx.org/ru/docs/

#虚拟主机配置
server {
    listen       80; #侦听80端口,并为默认服务, default_server只能有一个
    server_name  localhost; #服务域名,可以有多个, 用空格隔开
    charset utf-8;

    location / {
        root   /usr/share/nginx/html; #定义服务器的默认网站根目录位置
        autoindex on;
        access_log on;
        index  index.html index.htm;  #定义index页面
    }

    location /api/v1 {
        proxy_pass http://192.168.3.233:8888; #代理本机8888端口服务
        proxy_send_timeout 1800;
        proxy_read_timeout 1800;
        proxy_connect_timeout 1800;
        client_max_body_size 2048m;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_set_header  Host              $http_host;   # required for docker client's sake
        proxy_set_header  X-Real-IP         $remote_addr; # 获取用户的真实IP地址
        proxy_set_header  X-Forwarded-For   $proxy_add_x_forwarded_for;
        proxy_set_header  X-Forwarded-Proto $scheme;
    }

    location /auth/ {
        proxy_pass http://192.168.3.233:8888; #代理本机8888端口服务
        proxy_send_timeout 1800;
        proxy_read_timeout 1800;
        proxy_connect_timeout 1800;
        client_max_body_size 2048m;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_set_header  Host              $http_host;   # required for docker client's sake
        proxy_set_header  X-Real-IP         $remote_addr; # pass on real client's IP
        proxy_set_header  X-Forwarded-For   $proxy_add_x_forwarded_for;
        proxy_set_header  X-Forwarded-Proto $scheme;
    }

    # 404定义错误提示页面
    # error_page 404             /404.html;
    error_page    404         /index.html; #将404错误页面重定向到index.html, 可以解决history模式访问不到页面问题
    # 500定义错误提示页面
    error_page   500 502 503 504 /50x.html;
}

3.2、Dockerfile

# 基础镜像
FROM nginx
# 作者
MAINTAINER kingtu
# 删除原有配置文件
RUN rm /etc/nginx/conf.d/default.conf
# 复制新的配置文件
COPY ./conf.d/webui.conf /etc/nginx/conf.d
# 复制静态资源文件
COPY ./static /usr/share/nginx/html

3.3、docker-compose.yml

version: "3"

services:
  webui:
    image: nginx:webui
    build:
      context: .
      dockerfile: Dockerfile
    container_name: webui
    restart: always
    ports:
      - 80:80

4、构建镜像并启动Nginx服务

$ docker-compose up -d --build
Creating network "webui_default" with the default driver
Building webui
Step 1/5 : FROM nginx
 ---> 6678c7c2e56c
Step 2/5 : MAINTAINER kingtu
 ---> Running in 50ec65301064
Removing intermediate container 50ec65301064
 ---> a74db0ff9646
Step 3/5 : RUN rm /etc/nginx/conf.d/default.conf
 ---> Running in 9c52d55f1911
Removing intermediate container 9c52d55f1911
 ---> 990164d8ec80
Step 4/5 : COPY ./conf.d/webui.conf /etc/nginx/conf.d
 ---> 82c55aa5e8d1
Step 5/5 : COPY ./static /usr/share/nginx/html
 ---> fbf718b54a30
Successfully built fbf718b54a30
Successfully tagged nginx:webui
Creating webui ... done

5、查看镜像

nginx:latest为官方镜像，nginx:webui为基于官方镜像二次构建的镜像。

$ docker images | grep nginx
nginx               webui               ce8f266b8f9b        3 hours ago         139MB
nginx               latest              6678c7c2e56c        4 weeks ago         127MB

5、查看服务是否正常启动

$ docker ps
CONTAINER ID        IMAGE               COMMAND                  CREATED             STATUS              PORTS                               NAMES
271b1b96a530        nginx:webui         "nginx -g 'daemon of…"   3 hours ago         Up 3 hours          0.0.0.0:80->80/tcp                  webui

6、浏览器访问效果

至此，使用docker-compose部署Nginx反向代理服务完成。

参考连接：

Nginx部署前后端分离服务以及配置说明
Tips for Deploying NGINX (Official Image) with Docker

如需在Nginx配置文件中引用环境变量请参考以下博文：

How can I use environment variables in Nginx.conf
利用环境变量注入修改Docker中的Nginx配置