如何用Docker和Nginx在同一域名子路径部署多个Angular站点？

1. 预处理Angular项目 #

每个Angular项目构建时必须指定--base-href参数，确保资源引用和路由路径匹配子路径：

• website1：执行 ng build --base-href /website1/，构建产物输出到dist/website1
• website2：执行 ng build --base-href /website2/，构建产物输出到dist/website2
• website3：执行 ng build --base-href /website3/，构建产物输出到dist/website3

2. 编写Nginx配置文件（nginx.conf） #

创建自定义Nginx配置，处理子路径的静态文件服务和路由 fallback：

server {
    listen 80;
    server_name localhost;

    # 处理website1子路径请求
    location /website1/ {
        alias /usr/share/nginx/html/website1/;
        try_files $uri $uri/ /website1/index.html;
    }

    # 处理website2子路径请求
    location /website2/ {
        alias /usr/share/nginx/html/website2/;
        try_files $uri $uri/ /website2/index.html;
    }

    # 处理website3子路径请求
    location /website3/ {
        alias /usr/share/nginx/html/website3/;
        try_files $uri $uri/ /website3/index.html;
    }

    # 根路径默认跳转（可选配置）
    location / {
        return 302 /website1/;
    }
}

3. 编写Docker Compose文件（docker-compose.yml） #

通过Nginx容器统一托管三个Angular站点，挂载构建产物和配置文件：

version: '3.8'

services:
  angular-multi-site:
    image: nginx:alpine
    ports:
      - "8080:80"
    volumes:
      # 挂载各项目构建产物到Nginx对应子目录
      - ./website1/dist/website1:/usr/share/nginx/html/website1
      - ./website2/dist/website2:/usr/share/nginx/html/website2
      - ./website3/dist/website3:/usr/share/nginx/html/website3
      # 挂载自定义Nginx配置覆盖默认配置
      - ./nginx.conf:/etc/nginx/conf.d/default.conf
    restart: unless-stopped

4. 目录结构要求 #

确保项目文件结构如下：

project-root/
├── website1/
│   └── dist/
│       └── website1/  # Angular构建产物目录
├── website2/
│   └── dist/
│       └── website2/
├── website3/
│   └── dist/
│       └── website3/
├── nginx.conf
└── docker-compose.yml

5. 启动服务 #

在项目根目录执行命令启动容器：

docker-compose up -d

启动完成后即可通过以下地址访问各站点：

• https://docker:8080/website1
• https://docker:8080/website2
• https://docker:8080/website3

注：如果需要HTTPS访问，需在Nginx配置中添加SSL证书相关配置（指定ssl_certificate和ssl_certificate_key路径），并在Docker Compose中映射443端口。

内容的提问来源于stack exchange，提问作者Fatih GÜLER