使用Docker将vue+springboot项目部署在服务器上_vue springboot docker desktop

目录

前言

正文

1.Docker环境

2.部署springboot

3.部署vue

4.Docker网络相关&前后端与mysql通信

后记

---

前言

本次使用服务器为阿里云学生免费的2核2g，应该是突发性能型t6.（提一下关于服务器的理解，阿里云ecs大概分两种，共享性和突发性能型，区别就是突发性能型有个cpu积分，运行消耗cpu积分，cpu负载越高消耗的越多，同时cpu积分也在不断上涨，但是就本次部署的项目感觉，总cpu积分达到上限后就没下降过，所以选购服务器只要负载不是特别高都不用担心积分问题，担心也可选购共享性，cpu积分详情参考阿里云突发性能实例CPU积分详解 – 阿里云百科 (aliyunbaike.com)）

系统为centos7.6

---

正文

1.Docker环境

Dokcer功能类似虚拟机，与虚拟机有一定区别。

可以通过Docker镜像来搭建环境，比如你想在服务器上部署一个mysql，正常你需要通过yum进行安装，过程复杂，还有可能因为网络问题迟迟安装不上；如果你想安装hadoop等大数据环境，还需要进行繁琐的配置，还有可能出各种问题。但使用Docker就不一样了，只需要使用docker pull拉取镜像，再通过docker run就构建了一个实例，mysql或者hadoop就已经可以使用了。本质上可以理解为别人在系统上搭建好了一个mysql环境，并把系统中不需要的功能精简了一下，你拿过来运行就能用了。

Docker安装，参考CentOS Docker 安装 | 菜鸟教程 (runoob.com)

安装完成之后就可以根据菜鸟教程中的Docker Hello World | 菜鸟教程 (runoob.com)测试一下了。

这里安装mysql测试一下，mysql有多个版本，可以在Docker Hub Container Image Library | App Containerization中查找，搜索mysql就可以查看各个版本拉取镜像的命令

红框就是拉取镜像的命令，在命令最后比如那个:latest 是指版本，不写默认就是最新，写8.0.25就是8.0.25版本。

运行命令拉取之后，通过下面命令可以查看所有镜像：

docker images

 下一步就是创建实例运行，输入如下命令：

docker run -itd --name mysql-test -p 3306:3306 -e MYSQL_ROOT_PASSWORD=123456 mysql:8.0.25

这里

-t: 在新容器内指定一个伪终端或终端。

-i: 允许你对容器内的标准输入 (STDIN) 进行交互。

--name：后面是实例名字。

-d：容器启动后会进入后台，此时想要进入容器，可以通过docker attach或docker exec加上空格和实例名字或id（推荐大家使用 docker exec 命令，因为此退出容器终端，不会导致容器的停止。），退出终端为exit命令。

例：

docker exec -it 243c32535da7 /bin/bash
 
docker attach 1e560fca3906 

-p 3306:3306 ：映射容器服务的 3306 端口到宿主机的 3306 端口，外部主机可以直接通过 宿主机ip:3306 访问到 MySQL 的服务。

MYSQL_ROOT_PASSWORD=123456：设置 MySQL 服务 root 用户的密码。

mysql:8.0.25：末尾的这个是指镜像名字和版本，同样不写版本默认最新，本地镜像没有自动从远端拉取。

输入如下命令查看实例

docker ps -a

 不加-a是查看运行中的实例。

现在阿里云服务器打开3306端口，就可以访问mysql了，使用navicat可以连接尝试：

就可以连接使用了。

删除这个需要先停止运行：

docker stop mysql-test

 删除实例是：

docker rm mysql-test

删除镜像是：

docker rmi mysql:8.0.25

2.部署springboot

部署自己的程序需要构建自己的镜像，写好springboot后，打包成一个jar文件，编写一个Dockefile文件就可以使用docker build命令构建镜像。

FROM openjdk:11
ADD cloud-factory-0.0.1-SNAPSHOT.jar app.jar
EXPOSE 9000
ENTRYPOINT ["java","-jar","/app.jar"]

from后面是环境，环境也是dokcer的镜像，这相当与依据原有镜像添加自己的东西构建新镜像，根据自己springboot项目的java环境来写，我的是jdk11.

jar包与Dockerfile文件上传到服务器，放在同一目录下，add后面第一个是自己打完jar包后的名字，下面两行是暴露端口和运行命令。

编写完上传服务器之后在文件所在目录下运行如下命令构建镜像：

docker build -t springboot-test:v1 .

这里springboot-test:v1是镜像名字和tag（版本），后面的点是指当前目录下，如果你在别的地方运行命令就更换一下这个部分的路径。

最后使用docker run命令

docker run -itd --name springboot -p 9000:9000 springboot-test

这时项目就已经运行了。

3.部署vue

vue部署也是类似，vue可打包为dist文件：

npm run build

vue打包之后本质上就是一堆html、css……的文件，不能提供服务或直接运行，这里就需要使用nginx。

Nginx可能很多人都用过，比如使用它搭建博客等，安装后替换其下index.html即可运行自己的东西，这里便需要使用Nginx让vue运行起来。

Dockerfile如下

FROM nginx
 
RUN rm /etc/nginx/conf.d/default.conf
 
ADD default.conf /etc/nginx/conf.d/
 
COPY dist/ /usr/share/nginx/html/

这里提到了一个default.conf文件，用于进行一些配置，文件如下：

server {
    listen       80;
    server_name  localhost; # 修改为docker服务宿主机的ip
 
    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html =404;
    }
 
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

然后三个文件和文件夹放在服务器同一目录下和springboot一样构建镜像运行即可、

4.Docker网络相关&前后端与mysql通信

这里部署前需要注意修改通信的地址端口，springboot与mysql通信需要将地址替换为服务器ip地址，vue一般通过axios通信，地址也需要修改，跨域问题部署前应该已经得到解决，如果springboot有关跨域设置限定来源的话也需要进行修改。（我在部署时就因为这个问题搞了很久，我当时使用的是自己创建一个docker的bridge网络，并将三个服务加入到这个网络中，通信地址没用ip使用的名字，下面有提到，结果忘了跨域请求这个地方发起请求的是本地浏览器，springboot:9000是访问不到的）

由于使用了Docker，所以网络会有差异，通过ifconfig查看三者网络在docker0网卡下，三者相当于在该网络下的三个服务器，访问localhost是访问不到彼此的，只能通过ip。

docker0下相当于一个局域网，三者可以通过ip与彼此通信，但ip可能会变动，所以还需要通过docker run时起的名字互相通信，比如springboot通过mysql-test:3306就能访问mysql。

docker中同样可以创建网络，比如创建一个bridge模式网络：

docker network create default_network

这里使用ifconfig发现多了一个虚拟网卡，可以在创建实例时将实例加入该网络，docker run命令中加上--network default_network即可，同一局域网中的各个实例可以通过上述方式通信，也可以通过服务器ip加端口通信。

后记

Docker还是很好用的，而且并不复杂，可以将自己在学校写过的各种管理系统部署到服务器上，在学习大数据时，搭建hadoop、hbase等的环境也会非常方便。