简述：Spring boot+Vue 前后端分离项目部署，主要采用docker容器部署方式。
Springboot项目部署：docker构建mysql环境+docker构建项目自身环境。
Vue项目：使用docker启动nginx服务器方式代理部署。
1.SpringBoot项目部署
项目使用mysql8.0作为数据源，所以部署时需要使用docker构建mysql环境及项目自身环境。
1.1.mysql容器
1.1.1.拉取镜像
docker pull mysql:8.0.22 #pull成功之后通过 docker images查看
1.1.2.运行容器
docker container run --name mysql8.0.22 -p 3306:3306 -v /$mysql8.0.22/data:/var/lib/mysql -e MYSQL_ROOT_PASSWORD=123456 -d mysql:8.0.22
连接出现1251错误时：
#1.进入容器
docker exec -it mysql8.0.22 /bin/bash
#2.连接mysql服务器进行配置修改
use mysql;
alter user 'root'@'%' identified with mysql_native_password by '123456';
flush privileges;
1.2.项目容器
首先将项目进行打包：mumu-0.0.1-SNAPSHOT.jar
1.2.1.Dockerfile文件
FROM openjdk:11.0-jre
VOLUME /tmp
COPY mumu-0.0.1-SNAPSHOT.jar mumu.jar
RUN bash -c "touch /mumu.jar"
EXPOSE 8081
ENTRYPOINT ["java","-jar","mumu.jar","--spring.datasource.url=jdbc:mysql://192.168.18.170:3308/nms8000?createDatabaseIfNotExist=true&autoReconnect=true&useUnicode=true&characterEncoding=utf8&serverTimezone=Asia/Shanghai"]
解释：
FROM openjdk:11.0-jre：项目jdk运行环境，Dockerfile可以通过FROM指令直接获取它的状态，也就是在容器中java是已经安装的，接下来通过自定义的命令来运行Spring Boot应用。
VOLUME：指向了一个/tmp的目录，由于Spring Boot使用内置的Tomcat容器，Tomcat默认使用/tmp作为工作目录。效果就是在主机的/var/lib/docker目录下创建了一个临时文件，并连接到容器的/tmp。
将项目的jar文件作为app.jar添加到容器
RUN：表示在新创建的镜像中执行一些命令，然后把执行的结果提交到当前镜像。这里使用touch命令来改变文件的修改时间，Docker创建的所有容器文件默认状态都是“未修改”。这对于简单应用来说不需要，不过对于一些静态内容（比如：index.html）的文件就需要一个“修改时间”。
EXPOSE：容器向外暴露的端口，用于容器生成时和主机某端口进行映射 必要
ENTRYPOINT：容器应用启动命令 参数设定
# 注意： ENTRYPOINT 配置相关ip地址时，localhost或者127.0.0.1会被指向当前容器，例如：如果你需要连接本机中的mysql服务器，你必须把ip换成本机ip而不是localhost
1.2.2.生成镜像
$ docker image build -t mumu .
# 或者
$ docker image build -t mumu:0.0.1 .
解释：
-t参数用来指定 image 文件的名字，后面还可以用冒号指定标签。如果不指定，默认的标签就是latest。最后的那个点表示 Dockerfile 文件所在的路径
image创建成功可以通过 docker image ls / docker images 来查看新生成的docker image信息
1.2.3.运行容器
docker container run --name mumu -p 8081:8081 \
-v /opt/jar/springBootDocker/logs:/home/nms/sunam/docker-volumes/mumu \
-it -d mumu:0.0.1 /bin/bash
解释
run: 容器启动命令
--name 自定义容器命名
-d 程序后台启动
-v /opt/jar/boot-docker/logs:/log 应用日志 数据卷的方式存储，将容器中的/log文件夹挂载到本机中的/opt/jar/boot-docker/logs
-p 8081:8081 用主机(前面)端口映射容器中(后面)的端口
-it参数：容器的 Shell 映射到当前的 Shell，然后你在本机窗口输入的命令，就会传入容器
mumu:0.0.1 image名称 （如果有标签提供标签，默认是 latest 标签）
/bin/bash 容器启动以后，内部第一个执行的命令。这里是启动 Bash，保证用户可以使用 Shell
到此，springboot项目采用docker方式运行部署结束。
2.Vue项目部署
2.1.项目打包
npm run build
DONE Build complete. The dist directory is ready to be deployed.
执行完成之后会在项目目录下生成文件夹dist，之后我们将该文件夹进行nginx代理部署即可
其他开发中使用到的命令(本人后端开发，对vue使用不是很了解，顺带记录下)：
1.vue ui #启动在线项目可视化管理
2.npm run serve #启动vue项目
3.vue add element #项目添加element插件依赖
4.vue add axios #项目添加axios插件依赖
2.2.nginx部署
使用docker容器方式运行nginx服务器。
2.2.1.代理概念
-
正向代理
代理client端，隐藏了client进行隐藏：由于一些原因客户端不能直接访问目标服务器，于是客户端将请求发送给中间代理服务器，由中间代理服务器向目标服务器发起请求，并将请求到的数据返回给客户端。在这个过程中，目标服务器并不知道客户端姓甚名谁，因为它收到的只是中间代理服务器的请求。此时，客户端和中间代理服务器是一个整体，客户端对目标服务器是隐藏的。
-
反向代理
代理server端，对server端进行隐藏：比如一个基本的微服务系统，会有网关转发模块和多种业务模块，我们通过在网关层进行路由配置，不同路由前缀访问到后端不同的业务模块，并对客户端只暴露网关的端口，比如客户端可以通过
ip:9999/user/**访问用户模块信息，通过ip:9999/order/**访问订单模块信息，对于客户端来说，只是访问了网关服务9999，对于用户模块和订单模块是不知道的。此时，网关层扮演的就是服务反向代理。
2.2.2.拉取镜像
docker pull nginx #命令默认latest，也可自己指定版本
2.2.3.运行容器
对于nginx服务器，重要的两个操作是：
配置页面访问资源，配置路径：/usr/share/nginx/html
修改nginx.conf文件，配置具体代理策略
所以我们在配置启动nginx容器的时候，需要将对应的目录及文件进行宿主机挂载，方便后续更新资源及操作
启动命令：
$ docker run -d --name nginx -p 80:80 \
-v $NGINX/html:/usr/share/nginx/html \
-v $NGINX/log:/var/log/nginx \
-v $NGINX/nginx.conf:/etc/nginx/nginx.conf \
-d nginx
# 注意：这种方式是读取宿主机下的资源及配置进行启动，所以要求“$NGINX/html”及“$NGINX/nginx.conf”文件有效，否者容器会启动失败，可以先进行目录及文件不挂载方式运行，将nginx中的“/etc/nginx/nginx.conf”配置文件拷贝出来。
# 拷贝命令：
docker cp nginx:/etc/nginx/nginx.conf .
docker cp nginx.conf nginx:/etc/nginx/nginx.conf #将nginx.conf拷进容器
2.2.4.资源及代理配置
将vue打包后的dist文件目录上传到服务器对应目录下“$NGINX/html”
-
nginx.conf文件配置
user nginx; 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 localhost; location / { root /usr/share/nginx/html/dist;#资源目录 dist为vue打包编译后的目录 index index.html index.htm; } location /mumu/ { proxy_pass http://192.168.27.51:8081/;#192.168.27.51为当前linux宿主机ip；8081为springboot项目容器暴露的端口 proxy_read_timeout 6000s; proxy_set_header Host $host:$server_port; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; client_max_body_size 1024M; } } include /etc/nginx/conf.d/*.conf; } -
nginx容器重启
docker restart nginx
2.3.访问测试
访问"ip:8081/test"可以访问到springboot项目test接口
访问"ip:80"可以直接访问到vue默认页面
访问"ip:80/mumu/test"可以访问到springboot项目test接口
