docker:每个前端项目一个 Nginx 容器还是只有一个Nginx容器

结论

不一定每个前端项目单独一个Nginx容器。两种方案,看你的项目数量、医院运维要求、交付形态(你想要单镜像交付这件事)。

前提:多个前端SPA项目,比如:

项目A:门诊管理 /a

项目B:病案统计 /b

项目C:系统管理 /c

方案1:多个前端,共用同一个Nginx容器【优先推荐】

✅ 核心:一个Nginx容器,内部托管多个dist,Nginx通过location子路径区分不同前端项目

交付:只需要1个Nginx镜像 ,镜像里内置全部多个项目的dist + 一套nginx配置。

适合:3~8个前端项目,项目数量不算特别多。

目录结构(镜像内)

复制代码
/usr/share/nginx/html/
├── project-a/   # 项目A dist
├── project-b/   # 项目B dist
└── project-c/   # 项目C dist

Nginx核心配置示例:

nginx 复制代码
# 项目A,访问 /a
location ^~ /a/ {
    alias /usr/share/nginx/html/project-a/;
    try_files $uri $uri/ /a/index.html;
}
# 项目B,访问 /b
location ^~ /b/ {
    alias /usr/share/nginx/html/project-b/;
    try_files $uri $uri/ /b/index.html;
}
# 项目C,访问 /c
location ^~ /c/ {
    alias /usr/share/nginx/html/project-c/;
    try_files $uri $uri/ /c/index.html;
}

# API统一转发到后端服务
location /api/ {
    proxy_pass http://hospital-api:8080/;
    ...
}

⚠️ 重点:每个前端打包 publicPath 要对应子路径

项目A publicPath: '/a/',项目B publicPath: '/b/',否则资源404。

优点

  1. 只维护1个Nginx容器、1个镜像,交付物简单,符合你"一个镜像交付"诉求
  2. 只需要开放服务器一个端口80/443,医院信息科最喜欢,不用一堆端口备案、防火墙放通
  3. 统一SSL证书、统一限流、统一安全头、统一日志审计,等保更友好
  4. 资源占用低,不用多个nginx进程

缺点

  1. 版本发布耦合:更新其中一个前端项目,整体要重建镜像(如果dist打进镜像) ;
    👉 如果用前面说的zip解压方案:只替换对应项目zip,不用重建镜像。
  2. 故障隔离弱:Nginx配置写错,所有前端全部挂掉(但是医院私有化单机场景,这个风险可以接受,做好 nginx -t 校验)

方案2:一个前端项目 → 独立Nginx容器(多Nginx容器)

每个项目单独Nginx容器,每个容器只放一个项目dist。

一般搭配两种入口方式:

  • 方式A:每个容器监听不同宿主机端口:8081(A)、8082(B)
  • 方式B:再加一个前置Nginx/Traefik网关容器做路由分发(推荐,不要直接暴露一堆端口)

架构:用户访问 → 网关Nginx → 根据路径转发到各个前端Nginx容器

/a → nginx-a容器;/b → nginx-b容器

什么时候才选这个?

  1. 项目很多(>8个)、团队独立迭代、需要故障隔离:A项目更新不影响B/C
  2. 不同项目Nginx安全策略、缓存策略差异巨大
  3. 客户要求每个应用独立版本、独立交付镜像,审计上要求应用隔离(大型三甲、等保高要求场景)

缺点

  1. 容器多、镜像多,交付物一堆tar包,运维复杂,信息科抵触
  2. 如果不用前置网关,会占用大量端口,医院防火墙/堡垒机端口审批麻烦
  3. 多个Nginx进程,资源开销更大;证书、日志分散,审计麻烦

❌ 不推荐:直接多个Nginx容器各自暴露不同端口给用户访问,端口太多,医院基本不接受。

方案3:混合方案(推荐折中)

  • 主Nginx容器作为入口网关(统一SSL、统一日志)
  • 静态资源:多个前端dist全部放在主Nginx内部(方案1)
  • 只有重量级、独立业务域的系统,才单独拆成独立Nginx容器,由主网关反向代理过去

结合你之前的诉求:想要【单镜像交付】,怎么选

你目标:交付尽量少的镜像包,不想一堆零碎文件

👉 优先方案1:所有前端项目打包进同一个Nginx镜像,Nginx内部按子路径路由多个SPA

Dockerfile示例(多个前端打进同一个镜像)

dockerfile 复制代码
FROM nginx:1.24-alpine
# 拷贝多个前端dist
COPY ./dist-a /usr/share/nginx/html/project-a
COPY ./dist-b /usr/share/nginx/html/project-b
COPY ./dist-c /usr/share/nginx/html/project-c
# 统一nginx配置
COPY ./nginx/conf.d /etc/nginx/conf.d
COPY ./nginx/nginx.conf /etc/nginx/nginx.conf

RUN addgroup -g 101 -S nginx && adduser -S -u 101 -G nginx nginx
USER nginx
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

构建后只有1个镜像tar包,交付极简。

简单选型判断表

场景 方案
2~6个前端项目,单机私有化,交付要简单、单镜像 ✅ 共用一个Nginx容器,子路径分发
项目数量多,业务独立,强故障隔离,客户审计要求应用分开 多个Nginx容器 + 前置网关容器
项目之间域名不同(a.hospital.local、b.hospital.local) 依然可以共用1个Nginx,server_name区分
相关推荐
LaughingZhu17 分钟前
Product Hunt 热榜 2026-10-30:Empacer、Scape、Floot in ChatGPT
java·前端·数据库·人工智能·chatgpt·notion
Lank_M28 分钟前
抠图结果缩放后边缘发脏,该怪的不是插值
前端
jerrywus33 分钟前
Skill、MCP、Workflow、Rules、Memory 有什么区别?拿几次真实开发任务讲清楚
前端·agent·claude
补码缩写34 分钟前
canvas 与 sharp 缩放透明图:默认预乘,非预乘得拆通道
前端
静默回滚35 分钟前
抠图 PNG 缩小再放大,边缘又糊又白是两件事
前端
用户119770794807343 分钟前
GitHub 电商开源项目分享:用 sharp 批量出饰品主图,试了裁剪、细节图和色彩配置文件三个坑
前端·node.js
deli0071 小时前
地图定位为什么偏了 500 米?GPS 与火星坐标实测
前端
TK泰妞1 小时前
节日促销前,TikTok 商品视频应该提前准备什么?
前端·人工智能·节日
CCIE-Yasuo1 小时前
网络安全-学习web开发-列表、标签
前端·学习·web安全
小大宇1 小时前
Vue知识点-ElementPlus-06 单选+多选+下拉+日期选择
前端·vue.js·elementui