docker 部署 vue+springboot前端+后端 整合在一个镜像中

如果你自己独立开发了一套前后端分离的项目，想要把它放在一个docker镜像中，一键部署，真正做到开箱即用。

1、什么是docker

build once, run everywhere

2、打包前后端文件

2.1、打包前端文件

1.在项目下执行
注意！打包之前你的api不要设置成localhost或者127.0.0.1，而是要换成你等下要部署的服务器的ip地址

npm run build
//or
yarn build

2.会生成一个dist文件夹，里面就是你前端所有的代码，等会挂载到nginx服务上

2.2、打包后端文件

1.pom.xml里指定打包方式为jar包

<project>
	//意为在project下加入下面这个标签
	<packaging>jar</packaging>
</project>

2.打包

3.打包之后应该会在target下面生成jar包

3、制作docker镜像

注意：windows环境下也可以制作镜像，思路都是一样的
1.centos7下安装docker

# 安装依赖（以下是一整条命令）
yum install -y yum-utils \
  device-mapper-persistent-data \
  lvm2
# 设置仓库（以下是一整条命令）
yum-config-manager \
    --add-repo \
    https://download.docker.com/linux/centos/docker-ce.repo
# 安装docker
yum install docker-ce docker-ce-cli containerd.io
# 启动并加入开机启动
systemctl start docker
systemctl enable docker
# 验证是否安装成功
docker version

2.创建一个文件夹作为你制作镜像的根目录，然后把前后端打包的文件都传进去，可以用filezilla什么的，

3.在该目录下创建Dockerfile配置文件，至关重要

touch Dockerfile

4.编辑Dockerfile

# Docker image for springboot file run
# VERSION 0.0.1
# Author: cwiyc
# 基础镜像
FROM centos:8
# 维护人信息
MAINTAINER cwiyc <cwiyc922@gmail.com>
# VOLUME 指定了临时文件目录为/tmp。
# 其效果是在主机 /var/lib/docker 目录下创建了一个临时文件，并链接到容器的/tmp
VOLUME /tmp
# Centos8于2021年年底停止了服务，所以我们更新yum源为阿里镜像
RUN cd /etc/yum.repos.d/
RUN sed -i 's/mirrorlist/#mirrorlist/g' /etc/yum.repos.d/CentOS-*
RUN sed -i 's|#baseurl=http://mirror.centos.org|baseurl=http://vault.centos.org|g' /etc/yum.repos.d/CentOS-*
RUN yum -y install wget
RUN wget -O /etc/yum.repos.d/CentOS-Base.repo https://mirrors.aliyun.com/repo/Centos-vault-8.5.2111.repo
RUN yum clean all
RUN yum makecache
# 安装java
RUN yum -y install java
# 安装epel源
RUN yum -y install epel-release
# 安装nginx
RUN yum -y install nginx
# 将jar包添加到容器中并更名为app.jar
ADD orderonlineback-0.0.1-SNAPSHOT.jar app.jar
# 把自己本地的html里放的前端项目，放入nginx默认的资源目录里
COPY dist /usr/share/nginx/html
# 将自己的nginx.conf 配置文件放到docker里nginx默认的配置文件位置
COPY nginx.conf /etc/nginx/nginx.conf
# 暴露80端口
EXPOSE 80
# 运行jar包，ENTRYPOINT这条命令只能出现一次，如有多条，则只执行最后一条。该命令只有容器启动时才执行
ENTRYPOINT ["java","-Djava.security.egd=file:/dev/./urandom","-jar","/app.jar"]

5.在该目录下创建nginx配置文件nginx.conf，这样你可以更灵活的配置nginx。
location那个地方的try_files $uri $uri/ /index.html一定要写，默认是没有的，不写的话你刷新页面会404

touch nginx.conf

user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;

# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;

events {
    worker_connections 1024;
}

http {
    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;
    tcp_nodelay         on;
    keepalive_timeout   65;
    types_hash_max_size 2048;

    include             /etc/nginx/mime.types;
    default_type        application/octet-stream;

    # Load modular configuration files from the /etc/nginx/conf.d directory.
    # See http://nginx.org/en/docs/ngx_core_module.html#include
    # for more information.
    include /etc/nginx/conf.d/*.conf;

    server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  _;
        root         /usr/share/nginx/html;

        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;
        
        location / {
                try_files $uri $uri/ /index.html;
        }

        error_page 404 /404.html;
            location = /40x.html {
        }

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

}

6.制作镜像

// 注意最后的.
docker build -t 取个镜像名 .
//查看镜像，会出现你刚刚制作的镜像
docker images

4、新建一个容器运行镜像

提示：每一个镜像都需要运行在一个容器里
1.运行容器

# -d: 后台运行容器，并返回容器ID；
# -i: 以交互模式运行容器，通常与 -t 同时使用；
# -t: 为容器重新分配一个伪输入终端，通常与 -i 同时使用；
# --net="bridge": 指定容器的网络连接类型，支持 bridge/host/none/container: 四种类型；
docker run -itd  --name 取个容器名 --net=host 刚刚的镜像名
#例如 docker run -itd  --name bi43 --net=host backimage41
#查看正在运行的容器
docker ps

这时后端springboot项目已经运行了，我的是运行在9090
查看端口情况

netstat -ntlp
#如果没有这个命令，请安装
yum -y install net-tools

2.运行nginx

docker exec -it 刚刚的容器名 nginx
# 例如 docker exec -it bi43 nginx

这时nginx也启动起来了，80端口

5、保存制作好的镜像

1.保存镜像的改动

docker commit 刚刚的容器名 取一个新的镜像名
# 例如 docker commit bi43 bir1

此时生成了一个新的镜像，这就是你制作好的镜像。

2.阿里托管你的镜像
请看这个，push过程稍有些漫长
3.这时候你本地和远程仓库都有你的刚刚制作的镜像了，现在你只需要运行镜像即可(docker exec -it bi43 nginx这条命令还是需要执行来开启nginx)

6、mysql

至于mysql，centos7上mysql要付费了，所以要用的mariadb，它在数据的备份和还原上与mysql无痛交流