Docker中部署前后端分离项目
前言
最近呢，我的研究生老师想让我为实验室做一个管理资料的系统，我差不多有已经有1年没做过Web项目，正好拿这个试试手。我采用Springboot作为框架，Layui 的前后端分离的设计，我们学校内部服务器需要在Docker内部署项目。本篇文章记录了我在Docker中部署前后端项目的笔记。非常感谢博主阿杜 https://blog.csdn.net/y1534414425/article/details/117971395
我是新人博主曹操，希望小伙伴看完我的文章后觉得有收获，就点个关注，我会不定期的更新我的学习内容分享。此外文章中有不正确的，请小伙伴指正。谢谢大家。
项目打包
前端使用npm run build打包。文件打包后上传到服务器中，后端通过 Maven 中 clean package打包。
在项目打包的时候，一定要将数据库访问的链接，更换为你的服务器的ip，以及前台的访问后台的链接也要改为服务器的ip
问题来了，我后端项目是能够正常打包，但是我的前端项目一直打包不了。我采用Layui的模板，我的目录结构是这样的。打包一直报错。所有我干脆之间把项目压缩。
镜像拉取
在我的项目中，拉取了三个镜像分别是Mysql ，Jdk:8 , nginx镜像。
experiment-ui–9090 是前端容器
experiment-8887 是后端容器
mysql 是数据库容器
Mysql
系统使用的是 MySQL 数据库，所以要在 Docker 中安装 MySQL
docker pull mysql:5.7.31
运行Mysql
docker run -d --name myMysql -p 9509:3306 -v /data/mysql:/var/lib/mysql -e MYSQL_ROOT_PASSWORD=123456 mysql:5.7.31
大致参数解释一下
| 标签 | 用法 | 说明 |
|---|---|---|
| -v | /data/mysql:/var/lib/mysql | 数据卷技术：将服务器本地的文件，同步更新Docker镜像中的指定文件夹中 |
| -d | 后台运行 | |
| -e | 传递环境变量 | 更新默认 |
| -p | 9509:3306 | 9509外部访问的端口号，3306是docker内部端口号 |
打包后端并运行为容器
在 jar 包的同一级文件夹下新建 Dockerfile 文件，文件内容如下
FROM java:8
VOLUME /tmp
ADD experiment.jar experiment.jar
EXPOSE 8887
ENTRYPOINT ["java","-jar","/experiment.jar"]
参数解释
from java:8 拉取一个 jdk 为 1.8 的 docker image
experiment.jar 就是你上传的 jar 包，替换为 jar 包的名称
expeiment.jar 是你将该 jar 包重新命名为什么名称，在容器中运行
expose 该容器暴露的端口是多少，就是 jar 在容器中以多少端口运行
entrypoint 容器启动之后执行的命令，java -jar /experiment.jar 即启动 jar
打包镜像
docker build -t experiment.
运行容器
docker run -d -p 8887:8887 --privileged=true -v /public_datasets/fedml/experiment/service:/experiment/service --name experiment-8887 experiment
打包前端并运行为容器
在前端文件夹 experiment 的同一级文件夹下新建 Dockerfile 文件，文件内容如下
FROM nginx:latest
COPY ./front /usr/share/nginx/html/
EXPOSE 80
打包镜像
docker build -t experiment-ui .
运行容器
docker run -d --privileged=true -v /public_datasets/fedml/experiment/font:/experiment/font --restart=always -p 9090:80 --name nginx nginx
因为我的前端并没有打包成功，我直接将压缩包放置到nginx服务中，然后我就找到nginx 容器中的 /usr/share/nginx/html/ 文件夹中发现的文件是在这里面的，然后我就尝试了一下直接访问http://172.31.151.27:9090/page/login.html是能够直接访问的。
查看容器
最终效果
打开浏览器访问服务器 IP 即可看到效果
Ok 完结
参考博客
非常感谢博主阿杜https://blog.csdn.net/y1534414425/article/details/117971395