【Docker】docker部署springboot+vue+mysql+nginx前后端分离项目【部署实战篇】

news2024/11/18 18:25:03

文章目录

  • 0、安装docker并准备一个springboot-vue前后端分离项目
  • 前后端打包放到服务器上
  • 1、docker 安装jdk
  • 2、docker 安装mysql
    • 通过Docker命令进入Mysql容器内部
    • 初始化数据
    • sqlDbx连接查看
  • 3、docker build构建后端镜像
    • 修改配置数据库JDBC链接IP为虚拟机服务器IP
    • maven clean package打包后端jar并上传到服务器
    • 编写Dockfile
    • build 构建
    • 查看构建的后端镜像app
  • 4、docker run运行后端镜像
    • 查看运行容器app日志
      • java.net.NoRouteToHostException: No route to host (Host unreachable) --如果出现需要开启防火墙端口3306
    • 虚拟服务器防火墙增加端口3306
    • 验证后台是否链接mysql成功
    • 再次查看容器日志mysql成功
  • 5、docker 安装nginx镜像
  • 6、构建前镜像
    • 编写前端Dockfile
    • npm run build 前端打包镜像dist 上传到服务器 将default.conf 放在Dockerfile平级目录下
    • vue.config.js配置:target为后端地址
    • 执行docker build构建
    • 运行一个容器nginx-vue
    • 防火开启端口9090 80 否则Nginx会报错No Route...
    • 验证 前端->后端联通性
  • 7、登录成功

在这里插入图片描述

0、安装docker并准备一个springboot-vue前后端分离项目

安装docker: https://blog.csdn.net/qq_39900031/article/details/121666892
springboot-vue前后端分离项目:https://gitee.com/ma-haojie/springboot-vue-demo.git

前后端打包放到服务器上

在这里插入图片描述

1、docker 安装jdk

https://jackwei.blog.csdn.net/article/details/110227719

docker search openjdk:8
docker pull openjdk:8
docker run -di --name=jdk1.8 openjdk:8
docker exec -it jdk1.8 /bin/bash
root@2365c0f5b0ce:/# java -version
openjdk version "1.8.0_312"
OpenJDK Runtime Environment (build 1.8.0_312-b07)
OpenJDK 64-Bit Server VM (build 25.312-b07, mixed mode)
root@2365c0f5b0ce:/#

2、docker 安装mysql

docker pull mysql:5.7

在这里插入图片描述

docker run \
--name mysql \
-d \
-p 3306:3306 \
--restart unless-stopped \
-v /mydata/mysql/log:/var/log/mysql \
-v /mydata/mysql/data:/var/lib/mysql \
-v /mydata/mysql/conf:/etc/mysql \
-e MYSQL_ROOT_PASSWORD=123456 \
mysql:5.7

在这里插入图片描述

通过Docker命令进入Mysql容器内部

docker exec -it mysql /bin/bash
## 或者
docker exec -it mysql bash

初始化数据

# 1.拷贝SQL文件到mysql容器中
docker cp /root/app/springboot-vue.sql mysql:/springboot-vue.sql

# 2. 创建数据库
docker exec -it mysql mysql -uroot -p123456  

# 3.登陆控制台执行source 命令
mysql> source springboot-vue.sql

在这里插入图片描述

sqlDbx连接查看

在这里插入图片描述
在这里插入图片描述

3、docker build构建后端镜像

修改配置数据库JDBC链接IP为虚拟机服务器IP

在这里插入图片描述
在这里插入图片描述

maven clean package打包后端jar并上传到服务器

在这里插入图片描述

编写Dockfile

FROM openjdk:8
ENV APP_PATH=/root/app
WORKDIR $APP_PATH
ADD ./springboot-0.0.1-SNAPSHOT.jar /$APP_PATH/apps.jar
EXPOSE 9090
ENTRYPOINT ["java","-jar"]
CMD ["apps.jar"]

或者

FROM openjdk:8
ENV APP_PATH=/home/app
WORKDIR $APP_PATH
ADD ./springboot-0.0.1-SNAPSHOT.jar /$APP_PATH/apps.jar
EXPOSE 9090
ENTRYPOINT ["java","-jar","/home/app/apps.jar"]

build 构建

docker build -t app:0.1 .

在这里插入图片描述

查看构建的后端镜像app

在这里插入图片描述

4、docker run运行后端镜像

docker run --name app -p 9090:9090 --restart=always -d app:0.1

--restart=always参数能够使我们在重启docker时,自动启动相关容器。 Docker容器的重启策略如下:
no,默认策略,在容器退出时不重启容器 on-failure,在容器非正常退出时(退出状态非0),才会重启容器
on-failure:3,在容器非正常退出时重启容器,最多重启3次
always,在容器退出时总是重启容器
unless-stopped,在容器退出时总是重启容器,但是不考虑在Docker守护进程启动时就已经停止了的容器

在这里插入图片描述

查看运行容器app日志

docker  logs -f app

java.net.NoRouteToHostException: No route to host (Host unreachable) --如果出现需要开启防火墙端口3306

在这里插入图片描述

虚拟服务器防火墙增加端口3306

   查看防火墙状态命令         systemctl status firewalld
   重启防火墙命令            systemctl reload firewalld
   关闭防火墙命令            systemctl stop firewalld
查看数据库服务器已开放端口
firewall-cmd --list-ports
开放3406端口
firewall-cmd --zone=public --add-port=3306/tcp --permanent
firewall-cmd --zone=public --add-port=3306/tcp --permanent
重启防火墙命令            
systemctl reload firewalld
再次查看数据库服务器已开放端口
firewall-cmd --list-ports

在这里插入图片描述

验证后台是否链接mysql成功

curl -X GET http://localhost:9090/user?pageNum=1&pageSize=10&search=

在这里插入图片描述

再次查看容器日志mysql成功

docker  logs -f app

在这里插入图片描述

5、docker 安装nginx镜像

https://blog.csdn.net/BThinker/article/details/123507820

docker pull nginx:latest

6、构建前镜像

编写前端Dockfile

# 基础镜像使用Nginx
FROM nginx:latest
# 作者
MAINTAINER hjma
# 添加时区环境变量,亚洲,上海
ENV TimeZone=Asia/Shanghai
# 将前端dist文件中的内容复制到nginx目录
COPY dist  /usr/share/nginx/html/
# 用本地的nginx配置文件覆盖镜像的Nginx配置 必须跟Dockerfile平级目录
COPY default.conf /etc/nginx/conf.d/
# 暴露端口
EXPOSE 80

npm run build 前端打包镜像dist 上传到服务器 将default.conf 放在Dockerfile平级目录下

在这里插入图片描述

vue.config.js配置:target为后端地址

在这里插入图片描述

执行docker build构建

docker build -t vue-demo:1.0 .

在这里插入图片描述

运行一个容器nginx-vue

docker run \
-p 9876:80 \
--name nginx-vue \
-v /home/nginx-vue/conf/nginx.conf:/etc/nginx/nginx.conf \
-v /home/nginx-vue/conf/conf.d:/etc/nginx/conf.d \
-v /home/nginx-vue/log:/var/log/nginx \
-d vue-demo:1.0

在这里插入图片描述

防火开启端口9090 80 否则Nginx会报错No Route…

在这里插入图片描述

firewall-cmd --zone=public --add-port=80/tcp --permanent
firewall-cmd --zone=public --add-port=9090/tcp --permanent
重启防火墙命令            
systemctl reload firewalld
再次查看数据库服务器已开放端口
firewall-cmd --list-ports

在这里插入图片描述

验证 前端->后端联通性

##192.168.23.128我的虚拟机IP
curl -X GET http://192.168.23.128:9876/api/user?pageNum=1&pageSize=10&search=

在这里插入图片描述

7、登录成功

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/633889.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【MySQL】一文带你掌握聚合查询和联合查询

文章目录 1. 聚合函数1.1 COUNT1.2 SUM1.3 AVG1.4 MAX,MIN 2. GROUP BY3. HAVING4. 联合查询4.1 内连接4.2 外连接4.3 自连接4.4 子连接 5.合并查询5.1 UNION5.2 UNION ALL 1. 聚合函数 概念: 聚合函数是一种用于处理数据集合的函数,它将多个…

Fiddler 抓包的八个实用技巧,你学会了吗?

目录 前言 1、双击Session时,使响应页始终显示到”json”tab页;使请求页始终显示到“webform”tab页 2、显示每个Session 的请求IP地址 3、修改响应Header中的Content-Type 4、右键session 直接使用浏览器打开url 5、Session列中,显示每…

电脑拷贝到u盘数据丢失原因分析|3种恢复方法

在电脑操作中,经常需要将数据拷贝到U盘中进行备份或传输。但有时候,我们可能会遇到数据在拷贝或传输过程中丢失的情况。这种情况下,我们该如何找回这些丢失的数据呢? 下面,为大家介绍一些恢复U盘数据的方法&#xff0c…

[ICNN 1993] Optimal brain surgeon and general network pruning

Contents IntroductionMethodOptimal brain surgeon (OBS)Computing the inverse HessianThe ( t − o ) → 0 (\mathbf t-\mathbf o)\rightarrow 0 (t−o)→0 Approximation References Introduction 作者提出 Optimal brain damage (OBD) 的改进 Optimal brain surgeon (OB…

霍夫变换(Hough Transform)

文章目录 1. 什么是霍夫变换2. 霍夫直线检测2.1 霍夫直线检测的具体步骤2.2 霍夫直线检测的优缺点2.3 OpenCV中霍夫直线检测的应用2.3.1 标准霍夫检测2.3.2 概率霍夫检测 3. 霍夫圆检测4. 源码仓库地址 1. 什么是霍夫变换 霍夫变换(Hough Transform)是图像处理中的一种特征提取…

Spring Data Redis的使用

Redis的valus值的五种数据类型 问题:Windows下出现Could not connect to Redis at 127.0.0.1:6379: 由于目标计算机积极拒绝,无法连接。 解决方法为在Redis-x64-3.2.100目录下打开两个cmd窗口,分别输入 命令redis-server.exe redis.windows…

【Go知识点】Gorm Hook 无侵入实现 数据表防篡改

一、前言 Hi,开门见山的说,这次给大家带来的是关于 Gorm Hook 机制的落地场景,笔者也是在Gorm官方文档中了解到有Hook机制的存在,不过一直没有找到过太多合适的场景来使用。 最近刚好在做一块新业务的设计,因为涉及到…

PL2303HXA自2012已停产,请联系供货商的解决办法

一、概述 PL2303 是Prolific 公司生产的一种高度集成的接口转换器,可提供一个RS232 全双工异步串行通信装置与USB 功能接口便利连接的解决方案。PL2303具有多个历史版本,早期的版本是PL2303HX, 近年有PL2303HXA、PL2303HXC、PL2303HXD(D版本…

SpringCloud01:SpringCloud介绍、服务提供者、服务消费者

SpringCloud和SpringBoot的关系 SpringBoot专注于快速、方便地开发单个个体微服务,SpringCloud关注全局的治理框架,它将SpringBoot开发的一个个单体微服务整合并管理起来,为各个微服务之间提供:管理配置、服务发现、断路器、路由…

GO-slice详解

GO-slice详解 简介 slice(切片)是go中常见和强大的类型,这篇文章不是slice使用简介,从源码角度来分析slice的实现,slice的一些迷惑的使用方式,同时也讲清楚一些问题。 slice的底层实现是数组&#xff0c…

(转载)基于蚁群算法的三维路径规划(matlab实现)

1 理论基础 1.1 三维路径规划问题概述 三维路径规划指在已知三维地图中,规划出一条从出发点到目标点满足某项指标最优,并且避开了所有三维障碍物的三维最优路径。现有的路径规划算法中,大部分算法是在二维规划平面或准二维规划平面中进行路…

微服务框架

流量入口Nginx 在上图中可以看到,Nginx作为整个架构的流量入口,可以理解为一个外部的网关,它承担着请求的路由转发、负载均衡、动静分离等功能。作为一个核心入口点,Nginx肯定要采用多节点部署,同时通过keepalived来实…

(八)CSharp-泛型类和参数约束(1)

一、C# 中的泛型 泛型(generic)特性可以让多个类型共享一组代码。 泛型类型不是类型,而是类型的模板。 C# 提供了5种类型:类、结构、接口、委托和方法。 泛型类 泛型的主要优点: 性能 类型转换时,非泛型的…

2018~2019 学年第二学期《信息安全》考试试题(B 卷)

北京信息科技大学 2018 ~2019 学年第 2 学期 《信息安全》课程期末考试试卷 B 课程所在学院:计算机学院 适用专业班级:计科 1601-06,重修 考试形式:(闭卷) 一. 选择题(本题满分 10 分,共含 10 道小题,每小题 1 分) 网络中存在的安全漏洞主…

虚拟环境创建、配置及激活

虚拟环境创建、配置及激活 前言 一、虚拟环境是什么? 虚拟环境(Virtual Environment)是在计算机上使用特定版本的编程语言(如python 3.9)和其所需包及依赖项的一种方法(如pandas 2.4),它可以被看作是一个隔…

基于html+css的图展示121

准备项目 项目开发工具 Visual Studio Code 1.44.2 版本: 1.44.2 提交: ff915844119ce9485abfe8aa9076ec76b5300ddd 日期: 2020-04-16T16:36:23.138Z Electron: 7.1.11 Chrome: 78.0.3904.130 Node.js: 12.8.1 V8: 7.8.279.23-electron.0 OS: Windows_NT x64 10.0.19044 项目…

chatgpt赋能python:Python中如何快速删除字符串

Python中如何快速删除字符串 在Python编程中,字符串操作是非常常见的。有时候我们需要从字符串中删除一些无用的字符,以便更方便地处理数据。在本文中,将介绍Python如何快速删除字符串。 删除特定字符 Python中可以使用replace()函数快速替…

【深度学习炼丹大杀器——mlrunner初体验(以mmdetection为例)】

深度学习炼丹大杀器——mlrunner初体验(以mmdetection为例) 自动化炼丹,告别手动运行的烦恼~ 0.引言 了解深度学习的人都知道,炼丹是一种很玄学的事,并且还存在以下问题: 效率:在训练模型时&…

Seata服务端的启动过程 学习记录

1.ServerRunner ServerRunner类实现了CommandLineRunner与DisposableBean接口,将会在Spring容器启动和关闭的时间,分别执行 run 和 destory 方法。 而seata服务端的启动过程,都藏在run方法中 2.整体流程 io.seata.server.Server#start pu…

基于html+css的图展示120

准备项目 项目开发工具 Visual Studio Code 1.44.2 版本: 1.44.2 提交: ff915844119ce9485abfe8aa9076ec76b5300ddd 日期: 2020-04-16T16:36:23.138Z Electron: 7.1.11 Chrome: 78.0.3904.130 Node.js: 12.8.1 V8: 7.8.279.23-electron.0 OS: Windows_NT x64 10.0.19044 项目…