1.简介

说明：Docker Compose 是 Docker 的一个工具，用于通过一个 YAML 文件定义和管理多容器应用，可以同时启动、停止、重启整个应用，支持端口映射、数据卷、环境变量和服务依赖，只需一条命令就能管理多个容器，非常适合开发和多环境部署。

2.前端部署

2.1项目结构

说明：前端应用的源代码和构建产物目录。这是一个关键部分，包含：

dist/：静态资源目录。通常由前端框架（如Vue, React）构建（npm run build）生成。里面包含了HTML、CSS、JavaScript等文件，是最终要部署到Web服务器上的内容。
nginx/：Web服务器配置目录。存放Nginx的配置文件。在这个项目中，Nginx承担两个角色：
1. 静态文件服务器：托管frontend/dist/中的文件。
2. 反向代理服务器：将API请求转发到backend容器。
  - default.conf：主要的Nginx配置文件。
  - default-2025-12-13-17-54.conf：一个旧配置的备份文件，通常带有时间戳用于版本回滚。
Dockerfile：前端镜像构建文件。这个文件包含了构建前端运行环境的指令，通常会基于Nginx基础镜像，将dist目录和nginx/default.conf复制到镜像中，从而创建一个独立的前端容器。

2.2nginx

说明：Nginx 配置实现了监听 80 端口，提供前端静态文件服务并支持 SPA，禁用缓存，同时将 /universal-api/ 的请求反向代理到本机 8082 后端服务，并设置客户端真实 IP 和 Host 头，还定义了 5xx 错误页面和日志记录。

javascript 复制代码

server {
    listen 80;
    server_name localhost;

    root /usr/share/nginx/html;
    index index.html;
    access_log /var/log/nginx/access.log;
    error_log /var/log/nginx/error.log warn;
    location / {
        try_files $uri $uri/ /index.html;
        add_header Cache-Control no-store;
    }


    location /universal-api/ {
        proxy_pass http://host.docker.internal:8082/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
    }


    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
        root /usr/share/nginx/html;
    }
}

2.3Dockerfile

说明：Dockerfile 用官方 Nginx 镜像构建一个前端容器，设置为中国时区，拷贝前端打包文件和自定义配置，暴露 80 端口，并让 Nginx 前台运行以保持容器活着。

javascript 复制代码

FROM nginx:latest

# 设置时区为中国（CST）
RUN ln -sf /usr/share/zoneinfo/Asia/Shanghai /etc/localtime \
    && echo "Asia/Shanghai" > /etc/timezone
# 拷贝 dist 到 nginx
COPY dist /usr/share/nginx/html
COPY nginx/default.conf /etc/nginx/conf.d/default.conf

EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

2.4启动

2.4.1查看镜像

说明：没有任务容器启动。

docker images

2.4.2启动命令

说明：frontend 服务构建 Docker 镜像，而不启动容器。

docker compose build frontend

说明：启动 docker-compose 配置中的 frontend 服务，并在后台运行。

docker compose up -d frontend

2.4.3启动检测

说明：查看当前正在运行的 Docker 容器。

docker ps

2.4.4测试映射端口

说明：curl 命令测试 Docker 宿主机访问容器服务原理。看到前端页面，访问成功。

curl http://localhost:81

说明：或者通过浏览器直接访问。

3.后端部署

3.1项目结构

说明：target/: 由Maven构建后生成的目录。
forever-server.jar: 这是项目的最终成果，一个可执行的Spring Boot应用jar包。它包含了你的所有业务代码、依赖库和一个内嵌的Web服务器（如Tomcat）。
Dockerfile: 这是后端容器化的蓝图。它的作用是将 forever-server.jar打包进一个轻量级的、仅包含运行环境（如JRE）的Linux镜像中，使其成为一个独立的、可移植的容器。

3.2Dockerfile

说明：这个 Dockerfile 构建一个 Java 后端镜像，基于 Java 17 JRE，复制后端 jar 包和日志目录，暴露 8081 端口，并以生产环境配置启动 Spring Boot 应用。

javascript 复制代码

FROM eclipse-temurin:17-jre
WORKDIR /app

COPY target/forever-server.jar backend.jar

# 如果你需要 log 文件夹挂载，这里创建一个
RUN mkdir -p /app/logs

EXPOSE 8081

ENTRYPOINT ["java", "-jar", "backend.jar", "--spring.profiles.active=prod"]

3.3启动

3.3.1启动命令

说明：backend服务构建 Docker 镜像，而不启动容器。

docker compose build backend

说明：启动 docker-compose 配置中的 backend服务，并在后台运行。

docker compose up -d backend

2.4.4测试映射端口

说明：curl 命令测试 Docker 宿主机访问容器服务原理。

curl http://localhost:8082

说明：后端容器已经启动并监听端口；Spring Boot 服务运行正常，但请求的路径 / 不存在。

说明：不妨打印一下后端日志，说明成功启动。

docker logs backend --tail=200

3.4成功访问

说明：页面已经成功显示。

4.Compose 文件

4.1文件说明

说明：Compose 文件定义了前端 Nginx 和后端 Java 服务两个容器，分别映射端口、挂载日志目录，并为后端设置了 Java 内存参数，便于开发和部署统一管理。

frontend 服务：

build：从本地 ./frontend 目录构建镜像，使用该目录下的 Dockerfile。
container_name：容器名称设置为 frontend。
ports：将宿主机 81 端口映射到容器的 80 端口（Nginx 默认端口）。
volumes：将宿主机 ./logs/frontend 目录挂载到容器的 /var/log/nginx，方便查看 Nginx 日志。

backend 服务：

build：从本地 ./backend 目录构建镜像（使用默认 Dockerfile）。
container_name：容器名称设置为 backend。
ports：宿主机 8082 端口映射到容器 8081 端口（后端应用端口）。
volumes：将宿主机 ./logs/backend 挂载到容器 /app/logs，保存后端日志。
environment：设置环境变量 JAVA_OPTS，控制 Java 堆内存大小，初始 512MB，最大 1024MB。

javascript 复制代码

version: '3.8'

services:
  frontend:
    build:
      context: ./frontend
      dockerfile: Dockerfile
    container_name: frontend
    ports:
      - "81:80"

    volumes:
      - ./logs/frontend:/var/log/nginx
  backend:
    build:
      context: ./backend
    container_name: backend
    ports:
      - "8082:8081"
    volumes:
      - ./logs/backend:/app/logs
    environment:
      - JAVA_OPTS=-Xms512m -Xmx1024m

4.2命令介绍

说明：停掉以前的容器 (down)

docker-compose down

删除旧容器 (rm -f)

docker-compose rm -f

重新构建镜像，不用缓存 (build --no-cache)

docker-compose build --no-cache

后台启动新容器 (up -d)

docker-compose up -d

5.常见问题

5.1.拉取镜像

说明：有时候执行docker compose build frontend命令会出现一下报错信息，说明拉取镜像失败。

说明：推荐国内镜像拉取。网址如下

https://1ms.run/

docker pull docker.1ms.run/nginx:latest

5.2.数据库问题

说明：容器云连接宿主机数据库。容器访问宿主机的端口。localhost / 127.0.0.1 不行，因为容器的 localhost 指向容器自身，不是宿主机。可以使用具体的ip地址192.168.*.*，或者Docker Desktop 提供了一个特殊域名：host.docker.internal → 指向宿主机。

5.2.1PostgreSQL TCP/IP 监听配置

说明：PostgreSQL 监听哪些网络接口的 TCP/IP 连接 。

psql -h 127.0.0.1 -p 5432 -U postgres -d dev_universal_database
psql -h host.docker.internal -p 5432 -U postgres -d dev_universal_database

说明：psql: 无法联接到服务器: Connection refused (0x0000274D/10061) 服务器是否在主机 "host.docker.internal"(192.168.31.158) 上运行并且准备接受在端口 5432 上的 TCP/IP 联接。修改 PostgreSQL 配置允许 TCP/IP 连接，允许所有 IP 连接。添加如下：

listen_addresses = '*' # 允许所有 IP 访问

5.2.2pg_hba.conf：控制用户、数据库与 IP 访问

说明：psql: 致命错误: 没有用于主机 "192.168.31.158", 用户 "postgres", 数据库 "dev_universal_database", SSL 关闭的 pg_hba.conf 记录。

允许容器访问（不需要密码）

host all all 0.0.0.0/0 trust

#允许192.168.31.0/24网段访问（不需要密码）

host all all 192.168.31.0/24 trust

5.2.3成功

说明：访问成功。

5.3.命令总结

============================================

全量刷新整个服务（前后端）

============================================

docker-compose down # 停止并删除所有容器、网络（可选卷不会删除）

docker-compose rm -f # 强制删除已停止的容器

docker-compose build --no-cache # 重新构建所有镜像，不使用缓存

docker-compose up -d # 后台启动所有服务

============================================

前端操作

============================================

如果修改了 Dockerfile 或 dist 文件（前端构建产物）

docker compose build frontend # 只构建 frontend 镜像

docker compose up -d frontend # 只启动 frontend 容器

如果只修改了 nginx 配置

docker compose restart frontend # 重启 frontend 容器，使 nginx 配置生效

============================================

后端操作

============================================

docker logs backend --tail=200 # 查看 backend 容器最近 200 行日志

如果修改了 docker-compose.yml（端口、环境变量、卷挂载等）

docker compose down # 停掉旧容器

docker compose up -d --build # 重新构建并后台启动所有服务

============================================

数据库测试

============================================

psql -h 127.0.0.1 -p 5432 -U postgres -d dev_universal_database

连接宿主机本地 PostgreSQL 数据库

psql -h host.docker.internal -p 5432 -U postgres -d dev_universal_database

从容器内部连接宿主机 PostgreSQL 数据库

《Docker Compose 部署前后端分离项目实战：Nginx + Spring Boot（含完整踩坑记录）》

1.简介

2.前端部署

2.1项目结构

2.2nginx

2.3Dockerfile

2.4启动

2.4.1查看镜像

2.4.2启动命令

2.4.3启动检测

2.4.4测试映射端口

3.后端部署

3.1项目结构

3.2Dockerfile

3.3启动

3.3.1启动命令

2.4.4测试映射端口

3.4成功访问

4.Compose 文件

4.1文件说明

4.2命令介绍

5.常见问题

5.1.拉取镜像

5.2.数据库问题

5.2.1PostgreSQL TCP/IP 监听配置

5.2.2pg_hba.conf：控制用户、数据库与 IP 访问

允许容器访问（不需要密码）

5.2.3成功

5.3.命令总结

============================================

全量刷新整个服务（前后端）

============================================

============================================

前端操作

============================================

如果修改了 Dockerfile 或 dist 文件（前端构建产物）

如果只修改了 nginx 配置

============================================

后端操作

============================================

如果修改了 docker-compose.yml（端口、环境变量、卷挂载等）

============================================

数据库测试

============================================

连接宿主机本地 PostgreSQL 数据库

从容器内部连接宿主机 PostgreSQL 数据库