当前位置：首页 > article >正文

若依前后端分离项目部署（使用docker）

article 2025/1/3 3:41:55

文章目录

一、搭建后端
- 1.1 搭建流程：
- 1.2 后端零件:
- - 1.2.1 mysql容器创建：
  - 1.2.2 redis容器创建：
  - 1.2.3 Dockerfile内容：
  - 1.2.4 构建项目镜像：
  - 1.2.5 创建后端容器：
二、前端搭建：
- 2.1 搭建流程：
- 2.2 前端零件：
- - 2.2.1 nginx 容器创建：
  - 2.2.2 nginx.conf 文件：
  - 2.2.3 nginx html 数据卷所在位置：
  - 2.2.4 nginx conf 数据卷所在位置：
三、总结
- 3.1 后端：
- 3.2 前端：

由于之前做若依的二次开发项目，项目完成之后想部署到云服务器，折腾了好久才部署成功，所以总结下来，希望能帮到大家。

这里是使用docker进行部署的，如果想用别的方式部署，就需要友友网上再找找了。

这里做个规定：下面说到使用零件的意思就是使用下面我给出的资料，在对应资料有说明，友友要记得看，修改成自己的项目情况。

一、搭建后端

1.1 搭建流程：

首先需要把后端项目需要的程序先搭建好，如 mysql，redis（使用零件）
创建网桥（推荐根据项目命名），把mysql，redis和nginx（后面前端布置，现在先不用）放在一起
打包后端项目（后端项目的mysql和redis对应配置文件记得修改，如果放在一个网桥里面，可以使用网桥名称）。

在云服务器里面单独开一个文件夹（推荐使用项目相关名称命名），把后端项目上传到文件夹里面.（优点：便于管理）
在文件夹里面创建Dockerfile文件，填入对应零件内容（使用零件）

构建镜像（使用零件）
创建后端容器（使用零件）

1.2 后端零件:

1.2.1 mysql容器创建：

这里设置的mysql密码为123，有需要的友友自己修改一下。

docker run -d \
  --name mysql \
  -p 3306:3306 \
  -e TZ=Asia/Shanghai \
  -e MYSQL_ROOT_PASSWORD=123 \  
  -v ./mysql/data:/var/lib/mysql \
  -v ./mysql/conf:/etc/mysql/conf.d \
  -v ./mysql/init:/docker-entrypoint-initdb.d \
  mysql

1.2.2 redis容器创建：

这里设置的redis密码为123456，有需要的友友自己修改一下。

docker run -d \
  --name redis \
  -p 6379:6379 \
  -e REDIS_PASSWORD=123456 \
  redis:latest \

1.2.3 Dockerfile内容：

openjdk 是jdk的版本，这里使用的是jdk11，如果想使用其它版本可以自己改，一般直接用11也是可以的。

这里需要修改的就是xxx部分，修改成自己后端项目的名称，其它的不用改。

# 基础镜像
FROM openjdk:11.0-jre-buster
# 设定时区
ENV TZ=Asia/Shanghai
RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone
# 拷贝jar包
COPY xxxxx.jar /app.jar
# 入口
ENTRYPOINT ["java", "-jar", "/app.jar"]

1.2.4 构建项目镜像：

注意：构建镜像需要看完下面的解释之后再进行操作，一定一定。

docker build -t 镜像名称 .

. 表示Dockerfile文件路径就在当前路径。例如下图：自己在 root/dkd 中，Dockerfile 文件也在 root/dkd 中就可以使用.。
镜像名称无所谓，最好其和项目有关的。
后端项目需要放在和Dockerfile相同的文件夹里面。
基本和下图一样（项目名称不一样），除了 mysql，mysql 不需要创建在哪里（那里是错误的），mysql的数据我们使用客户端工具连上自己加。

1.2.5 创建后端容器：

docker run -d \
  --name 容器名(自己指定) \
  -p 8080:8080 \
  --network 网桥名 \
  镜像名(前面构建的)

二、前端搭建：

2.1 搭建流程：

nginx 容器创建（使用零件），记得放到网桥里面。
打包前端项目，生成 dist 文件（前端项目所在位置）。

下图为如何打包

下图为 dist 所在文件夹（在项目文件夹里面）：

把 dist 里面的所有内容拷贝到/var/lib/docker/volumes/html/_data 目录里面

修改/var/lib/docker/volumes/conf/_data/ 文件夹里面的 nginx.conf 文件（直接贴零件，稍加修改）。

最后不要忘记要重启 nginx 容器刷新配置。

2.2 前端零件：

不一定都会用到。

2.2.1 nginx 容器创建：

一般不用改。

docker run -d --name nginx -p 80:80 -v html:/usr/share/nginx/html -v conf:/etc/nginx nginx

2.2.2 nginx.conf 文件：

注意：下面有些要修改成自己项目的。

user  root;
worker_processes  auto;

error_log  /var/log/nginx/error.log notice;
pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #gzip  on;


    server {
        listen       80;
        server_name  159.75.xxx.145(记得切换);

        location / {
            root   /usr/share/nginx/html;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html; #防止刷新报404
            # try_files $uri $uri/ /index.html;
        }

        # location /prod-api/{
        #     proxy_set_header Host $http_host;ls
        #     proxy_set_header X-Real-IP $remote_addr;
        #     proxy_set_header REMOTE-HOST $remote_addr;
        #     proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        #     proxy_pass http://159.75.xxx.145:8080/;
        # }

        location /prod-api/{
			proxy_set_header Host $http_host;
			proxy_set_header X-Real-IP $remote_addr;
			proxy_set_header REMOTE-HOST $remote_addr;
			proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
			proxy_pass http://dkd-project(记得切换):8080/;
		}		
		location /dev-api/{
			proxy_set_header Host $http_host;
			proxy_set_header X-Real-IP $remote_addr;
			proxy_set_header REMOTE-HOST $remote_addr;
			proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
			proxy_pass http://dkd-project(记得切换):8080/;
		}

        

    }

    include /etc/nginx/conf.d/*.conf;



   
}