docker部署项目流程-基于若依系统(vue+springboot)

背景： 工作中使用了若依系统开发了项目，后来需要部署到linux的测试环境中，选择了docker方式部署。针对前台vue后台springboot的docker部署流程，在这里记录一下，有需要的朋友可以参考交流。

一. 部署环境准备

1. 开发好的若依架构项目：vue+springboot

2. linux服务器环境：CentOS Linux release 7.8.2003

   （ 查看Linux系统版本的命令：cat /etc/redhat-release，这种方法只适合Redhat系的Linux）

3. linux中已经安装好docker。

二. 后台部署步骤

打包spingboot后台项目

1. 打包前修改yml配置文件端口号信息

   设置为服务器对应的后台端口号信息，防止部署后访问不到后台
   

2. 在idea中进行打包：

• 打开右侧maven列表，双击clean保证编译不报错
• 双击package将springboot项目打成对应的 jar包
  
  

部署后台

1. 将jar包上传到服务器的一个目录中：/home/docker/java/ruiyi01

2. 在上述文件中编写Dockerfile文件用于创建镜像

   FROM java:8
   EXPOSE 8080
   ADD ruoyi-admin.jar ruoyi-admin.jar
   ENTRYPOINT ["java", "-jar", "/ruoyi-admin.jar"]
   

3. 使用docker命令创建镜像(注意创建前删除掉旧的重名镜像)

#在/home/docker/java/ruiyi01目录下，运行命令：（注意后面的点不可以省略）

docker build -t ruoyi-demo .   

4. 基于镜像运行一个后台容器

   docker run -d --name ruoyi-demo-run -p 8083:8083 ruoyi-demo
   

5. 查看容器是否运行成功

   • 查看容器运行情况 docker ps

   • 通过swagger测试一下后台接口是否可连接

     192xx.xx.xx:8083/swagger-ui.html
     

     

三. 前台部署步骤

打包vue项目

1. 打包前在js配置文件中修改后台地址和端口

   

2. 在idea中打包：

   D:\IdeaProjects\electronic\ruoyi-ui>npm run build:prod 
   

部署vue

1. 将dist文件夹上传到服务器的一个目录中：/home/docker/java/vue01

2. 编写default.conf 文件，并上传到 /home/docker/java/vue01目录中

   server {
           listen       80;
           server_name  192.xx.xx.xx;
   
           #charset koi8-r;
   
           #access_log  logs/host.access.log  main;
   
           location / {
               root   /usr/share/nginx/html;
   			try_files $uri $uri/ /index.html;
               index  index.html index.htm;
           }
   		
   		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://192xx.xx.xx:8083/;
   		}
   		location /boom {
   			proxy_redirect off;
   			proxy_pass http://192xx.xx.xx:8083/;
   			proxy_set_header Host $http_host;
   			proxy_set_header X-Real-IP $remote_addr;
   			proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
   		}
   
   
           #error_page  404              /404.html;
   
           # redirect server error pages to the static page /50x.html
           #
           error_page   500 502 503 504  /50x.html;
           location = /50x.html {
               root   /usr/share/nginx/html;
           }
   
           
       }
   

3. 在 /home/docker/java/vue01目录中，创建Dockerfile文件

   # 使用nginx镜像
   FROM nginx
   # 作者
   MAINTAINER xxm
   # 删除nginx 默认配置
   RUN rm /etc/nginx/conf.d/default.conf
   # 添加我们自己的配置 default.conf 在下面
   ADD default.conf /etc/nginx/conf.d/
   # 把刚才生成dist文件夹下的文件copy到nginx下面去
   COPY dist/  /usr/share/nginx/html/
   
   

   

4. 在 /home/docker/java/vue01目录中，执行命令创建镜像（注意后面的点不可以省略）

   docker build -t vue-demo .
   

5. 运行镜像的一个容器

   docker run -d --name vue-demo-run -p 8086:80 vue-demo
   docker ps
   

6. 浏览器中访问测试

http://192xx.xx.xx:8086

四、补充知识

多环境的配置思路

application.properties中配置通用内容，并设置spring.profiles.active=dev，以开发环境为默认配置
application-{profile}.properties中配置各个环境不同的内容
通过命令行方式去激活不同环境的配置。

FROM java:8
EXPOSE 8080
ADD ruoyi-admin.jar ruoyi-admin.jar
ENTRYPOINT ["java", "-jar", "/ruoyi-admin.jar","--spring.profiles.active=test"]

docker的学习与使用

对于新学习者来说，docker里面的概念比较抽象，如对镜像，容器这些。另外docker的命令和参数比较多。学习docker需要在大致了解概念的基础上，多操作多练习，再回过头来看里面的概念会更清晰。

五、总结

1. 前后台分别打包
2. 后台springboot的项目，通过Dockerfile文件创建对象镜像并运行
3. 前台vue项目部署时，通过nginx来关联前后台地址
4. Dockerfile文件创建镜像的命令为docker build，运行对应容器的命令为docker run
   ·