利用docker部署前后端分离项目

后端部署

数据库:

redis部署:

拉取镜像:

doker pull redis

运行容器:

docker run -d -p 6379:6379 --name my_redis redis

 mysql部署:

拉取镜像:

docker pull mysql

运行容器:我这里3306被占了就用的39001映射

docker run -d -p 39001:3306 -v /home/mysql/conf:/etc/mysql/conf.d -v /home/mysql/data:/var/lib/mysql -e MYSQL_ROOT_PASSWORD=123456 --name mysql_01 mysql

 利用workbench测试连接并将要用到的数据库表从本地数据库导入

yml文件配置修改

1.将数据库连接改为刚刚部署的,运行端口也可以按需更改

2.执行maven clean,再执行maven package 命令会生成target目录,里面有一个jar包 

3.在服务器上找个好位置放你的jar包,我是在home目录下创了/home/opt/dockerfiles目录,然后在这里创一个backend目录 mkdir backend,利用ftp将你的jar包上传上去,利用xftp直接拖过去就可以

 4.然后创建Dockerfile文件开始构建镜像

vim Dockerfile

Dockerfile文件如下,注意命令是大写 

FROM openjdk:17-jdkLABEL maintainer="px<318155349@qq.com>" ADD *.jar app.jar
EXPOSE 39001
CMD ["java" , "-jar", "/app.jar"]

然后构建镜像,执行下面指令

# 命令 docker build -f dockerfile文件路径 -t 镜像名：[tag]
root@iZbp1g3eaopeeodxj2dzqdZ:/home/opt/dockerfiles/backend# docker build -f Dockerfile -t sugarcane-backend .

利用构建的镜像创建容器并运行

root@iZbp1g3eaopeeodxj2dzqdZ:/home/opt/dockerfiles/backend# docker run -d -p 39002:39001 --name backend sugarcane-backend

这个时候可以在浏览器访问后端服务测试部署是否成功

前端部署 

这里采用nginx代理

nginx部署:

拉取镜像:

docker pull nginx

首先要将nginx的默认配置复制一份到主机

# 创建宿主机目录并自动填充默认配置
mkdir -p /usr/local/nginx/conf
docker run --rm nginx cat /etc/nginx/nginx.conf > /usr/local/nginx/conf/nginx.conf

 然后启动容器并挂载数据卷

docker run -d --restart=always --privileged=true --name px_nginx -p 39003:80 \
-v /usr/local/nginx/cert:/etc/nginx/cert \
-v /usr/local/nginx/conf/nginx.conf:/etc/nginx/nginx.conf \
-v /usr/local/nginx/html:/usr/share/nginx/html \
-v /usr/local/nginx/log:/var/log/nginx \
nginx

可以通过docker inspect px_nginx命令查看mounted下挂载的数据卷

 前端打包:

1.运行 npm run build 命令将前端打成dist

2.将dist上传到宿主机 /usr/local/nginx/html下

跟前面后端jar包上传一样

3.修改nginx.conf配置文件

root@iZbp1g3eaopeeodxj2dzqdZ:/usr/local/nginx/conf# vim nginx.conf

 修改后的conf文件如下:

需要注意的是如下规则,按你项目需求选择

    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;include /etc/nginx/conf.d/*.conf;server {listen 80;//容器内的端口server_name 121.40.170.98//服务器地址charset utf-8;location / {root /usr/share/nginx/html/dist; #前端工程存放路径，注意这里的路径是容器内的，不是宿主机的try_files $uri $uri/ /index.html;index index.html index.htm;}location /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://121.40.170.98:39002; # 后端项目的发布地址加端口}location /auth {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://121.40.170.98:39002; # 后端项目的发布地址加端口}}
}

4.重启nginx容器使配置生效

root@iZbp1g3eaopeeodxj2dzqdZ:/usr/local/nginx/conf# docker restart px_nginx

然后就可以访问39003(按你设置的端口映射来)