linux下前端vue+后端vue+mysql+redis+springboot+nginx的docker部署记录（nginx下多个vue前端）

1.服务器

推荐购买腾讯云的学生优惠25岁以下免验证，我购买的是轻量应用服务器，5M宽度每月1000G不香吗。
系统是CentOS 7.6。购买好服务器并通过Xshell或其他软件连接好，就是前期的准备了（当然除了项目，自备）。

2.安装docker

#安装
yum install docker
#检验安装是否成功
[root@localhost opt]# docker --version
Docker version 1.13.1, build 7f2769b/1.13.1
#启动
systemctl start docker

配置镜像加速
自行百度阿里云镜像加速配置，获取自己的加速器

vim /etc/docker/daemon.json

# 添加如下内容，具体地址自己申请咯
{
  "registry-mirrors": ["https://*******.aliyuncs.com"]
}

# 重启服务
systemctl daemon-reload
systemctl restart docker

3.安装docker-compose

1.换源：
curl -L https://get.daocloud.io/docker/compose/releases/download/1.25.0/docker-compose-`uname -s`-`uname -m` > /usr/local/bin/docker-compose

2.更改权限：chmod +x /usr/local/bin/docker-compose

3.查看版本：docker-compose --version

4.编写Dockerfile，docker-compose.yml文件

因为我们的项目需要成为docker的镜像，所以我们必须先编写Dockerfile文件构建我们的项目镜像然后进行编排，Dockerfile文件可以帮我们进行构建。

Dockerfile

FROM java:8
EXPOSE 81
ADD vueblog.jar app.jar
RUN bash -c 'touch /app.jar'
ENTRYPOINT ["java", "-jar", "/app.jar"]

docker-compose.yml
我们需要用到的软件与服务分别有nginx、mysql、redis、还有我们的springboot项目，所以编写如下：

version: "3"
services:
  nginx: # 服务名称，用户自定义
    image: nginx:latest  # 镜像版本
    ports:
      - 80:80  # 暴露端口
    volumes: # 挂载
      - /root/nginx/html:/usr/share/nginx/html
      - /root/nginx/nginx.conf:/etc/nginx/nginx.conf
    privileged: true # 这个必须要，解决nginx的文件调用的权限问题
  mysql:
    image: mysql:5.7.27
    ports:
      - 3306:3306
    environment: # 指定用户root的密码
      - MYSQL_ROOT_PASSWORD=****
  redis:
    image: redis:latest
  vueblog:
    image: vueblog:latest
    build: . # 表示以当前目录下的Dockerfile开始构建镜像
    ports:
      - 81:81
    depends_on: # 依赖与mysql、redis，其实可以不填，默认已经表示可以
      - mysql
      - redis

根据上方的服务名修改springboot配置文件中的地址
redis

mysql

5.准备好nginx的挂载目录和配置，上传vue

docker-compose.yml中已经提到，

宿主机的挂载目录：/root/nginx/html

挂载配置：/root/nginx/nginx.conf

所以我们在root目录下新建nginx目录，并进入nginx目录下新建html目录和一个nginx.conf配置文件。
并将两个vue项目打包（记得替换请求路径），分别在html下新建admin和front文件夹存放

然后对nginx.conf进行编写，具体配置如下：

nginx.conf

#user  root;
worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    server {
        listen       80;
        server_name  localhost;

        location / {
            root   /usr/share/nginx/html/front;
            try_files $uri $uri/ /index.html last; # 别忘了这个哈
            index  index.html index.htm;
        }

       location /admin {
	    alias /usr/share/nginx/html/admin;
	    expires  1d;
	    index index.html;
	    autoindex on;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

6.部署后端

一切准备就绪之后，我们就开始编排部署了哈。

首先本地打包vueblog项目，vueblog.jar，并上传到linux中，同时docker-compose.yml、Dockerfile也上传到同一目录下。如图所示：

然后我们执行一下编排命令:

cd ~
docker-compose up -d

其中-d表示后台服务形式启动
然后我们稍等片刻，特别是开始Building vueblog的时候可能时间有点长，耐心等待即可！
最后提示如下：

此时其实你已经可以访问前端页面了，但是数据库还没建，所以你还需要远程链接数据库，并创建对应表。然后再次输入

docker-compose up -d

重新启动springboot（先前没有数据，其实是启动失败了的）

远程连接docker的mysql容器

nginx同时部署多个vue项目

即使如此当访问admin后台时还是可能无法加载，我看了报错是因为部分js或css没找到，然后一看路径发现都少了admin于是我用文件连接工具直接在index.html文件中添加了admin,其实也不多就7处（就我的项目而言）

其实也可以在配置文件中添加配置自动生成，但是我怕出错，就直接改了。其实我已经重置两次系统部署项目了！
配置实现

我只改了文件的引入，所以后台路由并不会多出admin，域名/admin只是在进入后台页面时有效