docker部署vue和boot前后端分离以及redis+nginx+mysql配置(一篇全是经典)

docker部署vue和springboot前后端分离保姆级教程

首先我这里的环境是阿里云服务器centos7,加域名解析配置

1.docker安装

第一件事当然是安装docker

1.1卸载原有docker

yum remove docker \
                  docker-client \
                  docker-client-latest \
                  docker-common \
                  docker-latest \
                  docker-latest-logrotate \
                  docker-logrotate \
                  docker-engine
​

1.2安装yum包和存储驱动

yum install -y yum-utils

1.3设置阿里云镜像仓库

这种当然是采用阿里云镜像加速包了,国外镜像比较慢,我这里就不给出了

yum-config-manager \
    --add-repo \
    https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo

1.4安装docker

ce为社区版,而ee为企业版,这里采用社区版就够了

yum install docker-ce docker-ce-cli containerd.io

1.5启动docker

systemctl start docker

1.6查看docker版本

docker version

1.7配置阿里云镜像加速

由于后期拉取镜像都比较慢,所以这里配一个加速

sudo mkdir -p /etc/docker
sudo tee /etc/docker/daemon.json <<-'EOF'
{
  "registry-mirrors": ["https://xxx.mirror.aliyuncs.com"]
}
EOF
# 重启 Docker
sudo systemctl daemon-reload
sudo systemctl restart docker

1.8查看是否配置成功

docker info

2.mysql安装

2.1拉取mysql8.0版本

#docker pull为拉取镜像命令,后跟[服务名]:版本号,我比较喜欢用8.0版本,也可以写成5.7
docker pull mysql:8.0

2.2查看mysql镜像

docker images

2.3运行服务

docker run -d -p 3307:3306 --name mysql -v /mysqldata/mysql/log:/var/log/mysql  -v /mysqldata/mysql/data:/var/lib/mysql  -v /mysqldata/mysql/conf:/etc/mysql -e MYSQL_ROOT_PASSWORD=root   mysql:8.0
​

上述命令的含义: docker run:在docker中启动一个容器实例 -d:该容器在后台运行 -p 3307:3306:容器与主机映射端口为, 3306(主机端口,即外部连接mysql使用的端口号): 3306(容器端口) --name mysql:容器运行后的名称 -v /mysqldata/mysql/log:/var/log/mysql:将容器/var/log/mysql目录下的数据,备份到主机的 /mysqldata/mysql/log目录下 -v /mysqldata/mysql/data:/var/lib/mysql:将容器/var/lib/mysql目录下的数据,备份到主机的 /mysqldata/mysql/data目录下 -v /mysqldata/mysql/conf:/etc/mysql:将容器/etc/mysql目录下的数据,备份到主机的 mysqldata/mysql/conf目录下 -e MYSQL_ROOT_PASSWORD=root:设置当前mysql实例的密码为root mysql:8.0:需要运行的容器名称以及版本号 由于我们自己服务器的3306端口经常被自己服务器自带的mysql服务占用,因而我们用3307作为mysql服务端口

2.4查看服务运行状态

#-a可加可不加,列出全部信息
docker ps -a

 

3.redis安装

3.1拉取redis

docker pull redis:5.0.3

3.2查看镜像

docker images

3.3运行redis

若想查看更细致的redis安装教程请看这里(155条消息) Docker安装redis(保姆级教程&图文并茂)互联网-小阿宇的博客-CSDN博客docker部署redis并挂载保姆及教程csdn

docker run -id --name=redis -p 6380:6379 redis:5.0.3

同样6379服务已经占用

3.4查看服务状态同mysql

docker ps -a

4.制作后端镜像

4.1后端打包介绍

首先我们用jar包进行部署,关于这个mysql和redis端口的问题,我们应该这样写入

1.采用服务器ip+对外暴露端口

2.采用容器ip+容器映射端口

这两种组合便可以连接上docker内部的redis以及mysql服务

4.2查看容器服务ip

docker inspect 服务名
#查看redis容器ip
docker inspect redis
#查看mysql容器ip
docker inspect mysql
#查看端口则依旧是拿redis举例子
docker ps -a | grep redis

4.3打jar包说明

<build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <configuration>
                    <!-- 指定该Main Class为全局的唯一入口 -->
                    <mainClass>cn.blog.BlogApplication</mainClass>
                    <layout>ZIP</layout>
                </configuration>
                <executions>
                    <execution>
                        <goals>
                            <!--可以把依赖的包都打包到生成的Jar包中-->
                            <goal>repackage</goal>
                        </goals>
                    </execution>
                </executions>
            </plugin>
        </plugins>
    </build>

点击maven

打包成功后右键点击主项目点击show in explorer

找到刚打好的jar包

先本地在cmd窗口用java -jar XXX.jar测试一下是否能运行成功

创建lbs目录(可以随便起),创建一个nginx目录,便于后续存放docker中nginx配置以及前端打包好的文件

mkdir -p /lbs/nginx

将jar包上传至lbs文件夹下,有宝塔的可以直接拖拽上传

4.4制作dockerfile

vim Dockerfile
#jdk报错,别用
FROM openjdk:8
COPY wqmblog.jar /wqmblog.jar
CMD ["--server.port=8001"]
#对外暴露的端口
EXPOSE 8001
ENTRYPOINT ["java", "-jar", "/wqmblog.jar"]
​

我见有的教程采用了compose,但是我没用

4.5运行jar包

#一定要加.,代表在当前路径运行
docker build -t  wqmblog .
docker run -d --restart=always --name wqmblog -p 8001:8001 wqmblog

5.安装nginx

5.1直接拉取nginx

docker pull nginx

5.2配置nginx

# 创建 Nginx 容器,因为要拷贝一些文件以及设置挂载目录,需要先启动一个nginx容器,注意要把服务器自带的nginx删掉或停掉不要占用端口,方便域名配置
docker run -di --name nginx -p 80:80 nginx
# 将容器内的配置文件拷贝到宿主机新建的文件夹内,并重命名
docker cp nginx:/etc/nginx /lbs/nginx/conf
# 这时候就可以将当前的容器停掉、删除了
docker stop nginx
docker rm nginx
#建立前端存放的文件夹
cd /lbs/nginx/
mkdir front
#启动nginx配配置映射挂载路径
docker run -di --name mynginx -p 80:80 -v /lbs/nginx/conf:/etc/nginx -v /lbs/nginx/front:/usr/share/nginx/html --privileged=true -d nginx

/nginx/front:前端静态文件存放路径

/nginx/conf: nginx配置文件

域名解析,这里自己去购买一个域名,新人很便宜,解析一个www就行了,这个很简单,

然后将其配置在server_name上,同时也可以隐藏端口

​
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;
    
    server {
        listen       80;
        server_name  localhost 域名;
        location / {
            root /usr/share/nginx/html/dist/;
                    index index.html;
                    try_files $uri $uri/ /index.html;
        }
        location /api/ {
            # 注意这里不能写 localhost 或 127.0.0.1,因为 Nginx 也是部署在 Docker 上的,且都是采用
            # 的默认的 Bridge 网络模式,每个启动的容器都有自己 ip,类似于 172.17.0.x。如果写 localhost 或 127.0.0.1 本地           # 回环地址,会报错 502 错误。
            # 综上:此处需要写宿主机的 ip:宿主机暴露出的端口(docker ps 可看)
            # 或者写容器内的 ip:后端服务在容器内的端口(docker network inspect bridge 或 docker inspect 容器ID|名称 均可看)
          proxy_pass http://xxxx:8001/;
                    proxy_set_header Host $host;
                    proxy_set_header X-Real-IP  $remote_addr;
                    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                    proxy_set_header Product_Type 2;
        }
    }
​
    #gzip  on;
​
    include /etc/nginx/conf.d/*.conf;
}
​

6.vue打包

直接npm run build,然后将dist文件上传至front文件夹下,如果有其他种比如生产环境以及开发环境的切换配置请私聊我

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值