用Docker部署应用(React前端、Java Spring Boot后端和MySQL数据库)

好的,我将提供一个使用Docker部署React前端、Java Spring Boot后端和MySQL数据库的方案,并使用Nginx作为正向代理。以下是详细的Docker配置和部署方案,全部用中文说明。

Docker部署企业应用方案

项目结构

enterprise-app/
├── frontend/               # React前端项目
│   ├── Dockerfile
│   └── ... (React项目文件)
├── backend/               # Spring Boot后端项目
│   ├── Dockerfile
│   └── ... (Spring Boot项目文件)
├── nginx/                 # Nginx配置
│   ├── Dockerfile
│   └── nginx.conf
├── docker-compose.yml     # Docker Compose配置文件
└── mysql/                 # MySQL数据持久化
    └── init.sql          # 数据库初始化脚本

1. 前端Dockerfile (frontend/Dockerfile)

# 构建阶段
FROM node:18-alpine AS build
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm install
COPY . .
RUN npm run build

# 运行阶段
FROM nginx:alpine
COPY --from=build /app/build /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

2. 后端Dockerfile (backend/Dockerfile)

# 构建阶段
FROM maven:3.8.5-openjdk-17 AS build
WORKDIR /app
COPY pom.xml .
RUN mvn dependency:go-offline
COPY src ./src
RUN mvn package -DskipTests

# 运行阶段
FROM openjdk:17-jdk-slim
WORKDIR /app
COPY --from=build /app/target/*.jar app.jar
EXPOSE 8080
ENTRYPOINT ["java", "-jar", "app.jar"]

3. Nginx配置文件 (nginx/nginx.conf)

server {
    listen 80;
    server_name localhost;

    # 前端静态文件
    location / {
        root /usr/share/nginx/html;
        try_files $uri $uri/ /index.html;
    }

    # 后端API代理
    location /api/ {
        proxy_pass http://backend:8080/;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}

4. Nginx Dockerfile (nginx/Dockerfile)

FROM nginx:alpine
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

5. MySQL初始化脚本 (mysql/init.sql)

CREATE DATABASE IF NOT EXISTS enterprise_db;
USE enterprise_db;

-- 在此添加表创建脚本
CREATE TABLE IF NOT EXISTS users (
    id BIGINT AUTO_INCREMENT PRIMARY KEY,
    username VARCHAR(50) NOT NULL,
    email VARCHAR(100) NOT NULL
);

6. Docker Compose配置文件 (docker-compose.yml)

version: '3.8'
services:
  frontend:
    build:
      context: ./frontend
      dockerfile: Dockerfile
    container_name: react-frontend
    depends_on:
      - backend

  backend:
    build:
      context: ./backend
      dockerfile: Dockerfile
    container_name: spring-backend
    environment:
      - SPRING_DATASOURCE_URL=jdbc:mysql://mysql:3306/enterprise_db
      - SPRING_DATASOURCE_USERNAME=root
      - SPRING_DATASOURCE_PASSWORD=your_secure_password
      - SPRING_JPA_HIBERNATE_DDL_AUTO=update
    depends_on:
      - mysql

  mysql:
    image: mysql:8.0
    container_name: mysql-db
    environment:
      - MYSQL_ROOT_PASSWORD=your_secure_password
      - MYSQL_DATABASE=enterprise_db
    volumes:
      - ./mysql/init.sql:/docker-entrypoint-initdb.d/init.sql
      - mysql-data:/var/lib/mysql
    ports:
      - "3306:3306"

  nginx:
    build:
      context: ./nginx
      dockerfile: Dockerfile
    container_name: nginx-proxy
    ports:
      - "80:80"
    depends_on:
      - frontend
      - backend

volumes:
  mysql-data:

部署步骤

  1. 准备项目结构
    按照上述目录结构创建文件夹,并放置相应的文件。
  2. 配置环境变量
  • docker-compose.yml中将your_secure_password替换为强密码。
  • 根据需要调整Spring Boot的application.propertiesapplication.yml中的数据库配置,确保与docker-compose.yml中的设置一致。
  1. 构建和运行
   docker-compose up --build
  1. 访问应用
  • 前端:http://localhost
  • 后端API:http://localhost/api/
  • MySQL:localhost:3306(用于调试时)

注意事项

  • 前端使用Node.js构建,并通过Nginx提供静态文件。
  • 后端使用Maven构建,运行在OpenJDK 17上。
  • Nginx作为反向代理,将/api/请求转发到后端,静态文件服务于前端。
  • MySQL数据通过Docker卷实现持久化。
  • 根据需求调整SPRING_JPA_HIBERNATE_DDL_AUTO设置(例如updatecreatevalidate)。
  • 生产环境中需配置适当的网络设置(例如使用自定义网络、为Nginx添加SSL支持)。

如需进一步调整或生产环境优化(如添加SSL、日志管理或监控),请提供更多细节,我可以进一步完善方案。

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注