如何将前后端分离项目部署到本地的Docker Desktop容器运行并且访问

文章目录


前言

完成了客户的一个前后端分离项目,要求部署到客户电脑上去展示,那肯定不能直接把代码弄上去跑呀~~~,于是我就想把他们都打包部署到本地的docker容器里面,方便运行和访问,so,以下内容就详细介绍了如何将前后端分离项目部署到本地的docker容器运行。


一、安装Docker Desktop

  1. 安装链接:docker desktop
  2. 点击Download for windows 安装

    3.下载成功后双击Docker Desktop Installer.exe进行安装,安装成功后点击close关闭

  4.双击桌面图标进入docker desktop,如果出现以下报错,表示WSL版本太低,需要更新

5.安装最新的更新包

 用浏览器打开网址:旧版 WSL 的手动安装步骤 | Microsoft Learn   点击下载

6.下载完成后点击安装即可,然后再重启docker desktop,这就安装完成了

7.检验是否安装成功

8.docker设置国内镜像,右击托盘图标选择settings,选择Docker Engine菜单,增加国内镜像地址,增加私有仓库地址:

  "registry-mirrors": ["https://registry.docker-cn.com","http://hub-mirror.c.163.com","https://docker.mirrors.ustc.edu.cn"]
{"builder": {"gc": {"defaultKeepStorage": "20GB","enabled": true}},"experimental": false,"features":{"buildkit": true },"registry-mirrors": ["https://registry.docker-cn.com","http://hub-mirror.c.163.com","https://docker.mirrors.ustc.edu.cn"]}

 9.添加成功后重新启动docker desktop,现在我们尝试拉取nginx镜像,默认最新版本镜像

 现在我们的docker里面就多了一个镜像

二、后端项目打包及部署--springboot项目

1.修改IP地址

因为要部署到docker中,需要将连接MYSQL和Redis数据库的IP地址改为本地地址,cmd输入ipconfig获取IP地址

将host改为上面的IPV4地址,mysql和redis都要改

2.项目打包

打包完成后将target目录下的jar包复制到新的文件夹下,然后在此文件夹下新建Dockerfile文件

Dockerfile文件新增以下内容

## AdoptOpenJDK 停止发布 OpenJDK 二进制,而 Eclipse Temurin 是它的延伸,提供更好的稳定性
FROM eclipse-temurin:8-jre
##FROM openjdk:8ADD yudao-server.jar app.jar
ENTRYPOINT ["java","-jar","/app.jar"]## 暴露后端项目的 48080 端口
EXPOSE 48080

然后进入目录执行打包命令(前提要启动docker)admin-server是镜像名称

docker build -f Dockerfile -t admin-server .

注意末尾的空格加一个小点

完成后就可以在docker desktop看到镜像

最后运行我们的镜像文件

docker run -p 48080:48080 --name admin-server

如果报错连接不到MySQL数据库或者redis拒绝连接

  1. mysql连接问题:因为mysql只允许通过localhost或者127.0.0.1连接,需要修改mysql配置
  2. 在navacat修改,将user为root的Host修改为%

   3.redis问题:修改配置文件redis-windows.conf

        注释:bind 127.0.0.1

        将protected-mode yes改为protected-mode no

现在后端就可以正常启动啦

 二、前端项目打包及部署--vue项目

1.添加文件

由于选用Nginx,所以前端需增加Nginx的相关配置文件,在项目根目录下新建 nginx.conf配置文件。

内容如下:

server {listen       80 default_server;server_name  localhost; ## 重要!!!修改成你的外网 IP/域名gzip on;gzip_min_length 1k;     # 设置允许压缩的页面最小字节数gzip_buffers 4 16k;     # 用来存储 gzip 的压缩结果gzip_http_version 1.1;  # 识别 HTTP 协议版本gzip_comp_level 2;      # 设置 gzip 的压缩比 1-9。1 压缩比最小但最快,而 9 相反gzip_types text/plain application/x-javascript text/css application/xml application/javascript; # 指定压缩类型gzip_proxied any;       # 无论后端服务器的 headers 头返回什么信息,都无条件启用压缩location / { ## 前端项目root   /usr/share/nginx/html/;index  index.html index.htm;try_files $uri $uri/ /index.html;}location /prod-api/ { ## 后端项目 - 管理后台proxy_pass http://192.168.0.46:48080/; ## 重要!!!proxy_pass 需要设置为后端项目所在服务器的 IPproxy_set_header Host $http_host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header REMOTE-HOST $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;}
}

再创建Dockerfile文件

FROM nginx:latestCOPY dist/  /usr/share/nginx/html/
COPY nginx.conf /etc/nginx/conf.d/default.confEXPOSE 80

2.打包

打包vue项目,本文使用npm run build命令进行项目的打包。
打包完成后,会生成一个dist目录,可以新建文件夹,将三个文件放在一起

构建镜像:docker build -t front-server .

启动:

docker run -p 80:80 -d   --name front-server

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

LeetCode09——回文数

LeetCode09 自己写的解,转化为字符串再反转,比较笨。 import java.util.Scanner; public class Result01 {public static void main(String[] args) {System.out.println("请输入整数,我来帮您判断是否是回文数。");Scanner scanner new Sc…

Linux之解除ssh远程登录限制

背景:复制了一个虚拟机,将root密码重置为123456后,使用xshell通过ssh登录竟然失败,检查了很多次,确定root账号密码正确,以下是记录的排查过程。 1、查看ssh登录日志 Ubuntu:/var/log/auth.log…

2023年中国门把手产量、销量及市场规模分析[图]

门把手行业是指专门从事门把手的设计、制造、销售和安装等相关业务的行业。门把手是门窗装饰硬件的一种,用于开启和关闭门窗,同时也具有装饰和美化门窗的作用。 门把手行业分类 资料来源:共研产业咨询(共研网) 随着消…

R/d2及S/C4估计总体标准差,比较其CPK及规格限概率的差异

R/d2 和 S/C4 是用于估计总体标准差的无偏估计方法,通常用于控制图中。这些估计方法的主要目的是通过样本数据来估计总体标准差,以便监测过程的稳定性和变异性,而不需要收集整个总体的数据。 具体来说: R图中的 R/d2 和 S图中的…

【数据结构】二叉树--OJ练习题

目录 1 单值二叉树 2 相同的树 3 另一颗树的子树 4 二叉树的前序遍历 5 二叉树的最大深度 6 对称二叉树 7 二叉树遍历 1 单值二叉树 965. 单值二叉树 - 力扣(LeetCode) bool isUnivalTree(struct TreeNode* root) {if (root NULL){return true;}…

【linux】重定向+缓冲区

重定向缓冲区 1.重定向1.1重定向本质1.2重定向接口1.3重定向分类1.3.1>输出重定向1.3.2>>追加重定向1.3.3<输入重定向 2.理解 >&#xff0c; >>&#xff0c; <3.如何理解linux下一切皆文件4.缓冲区4.1理解缓冲区问题4.1.1为什么要有缓冲区4.1.2缓冲区刷…

【yolov5】改进系列——特征图可视化

文章目录 前言一、特征图可视化二、可视化指定层三、合并通道可视化总结 前言 对于特征图可视化感兴趣可以参考我的另一篇记录&#xff1a;六行代码实现&#xff1a;特征图提取与特征图可视化&#xff0c;可以实现分类网络的特征图可视化 最近忙论文&#xff0c;想在yolov5上…

Java系列 | 如何讲自己的JAR包上传至阿里云maven私有仓库【云效制品仓库】

什么是云效 云效是云原生时代一站式 BizDevOps 平台&#xff0c;产研数字化同行者&#xff0c;支持公共云、专有云和混合云多种部署形态&#xff0c;通过云原生新技术和研发新模式&#xff0c;助力创新创业和数字化转型企业快速实现产研数字化&#xff0c;打造“双敏”组织&…

Python数据挖掘入门进阶与实用案例:自动售货机销售数据分析与应用

文章目录 写在前面01 案例背景02 分析目标03 分析过程04 数据预处理1. 清洗数据2.属性选择3.属性规约 05 销售数据可视化分析1.销售额和自动售货机数量的关系2.订单数量和自动售货机数量的关系3.畅销和滞销商品4.自动售货机的销售情况5.订单支付方式占比6.各消费时段的订单用户…

uni-app 瀑布流布局的实现

方式一&#xff1a;使用纯 CSS 实现 使用 flex 布局方式 <!-- 瀑布流布局 --> <template><view class"container"><viewclass"cont-box":style"{ --layout-width: 100 / flowData.column - flowData.columnSpace % }"v-f…

CatBoost算法模型实现贷款违约预测

前言 此篇文章为整个Boost(提升方法)集成算法模型的终章&#xff0c;前几篇文章依次结合详细项目案例讲解了AdaBoost、GBDT、XGBoost、LighGBM共四个常用的集成算法模型&#xff0c;每一篇文章都包含实战项目以及可运行代码。仅通过看一遍文章不去实践是很难掌握集成算法模型的…

【API篇】三、转换算子API(上)

文章目录 0、demo数据1、基本转换算子&#xff1a;映射map2、基本转换算子&#xff1a;过滤filter3、基本转换算子&#xff1a;扁平映射flatMap4、聚合算子&#xff1a;按键分区keyBy5、聚合算子&#xff1a;简单聚合sum/min/max/minBy/maxBy6、聚合算子&#xff1a;归约聚合re…

maven 新建模块 导入后 按Ctrl 点不进新建模块pom定义

新建的ruoyi-common-mybatisplus 模块,导入一直不正常 画出的模块一直导入不进来 这是提示信息 这是正常的提示信息 加上 <version>3.6.3</version> 后,才一切正常

C++入门之引用与内联函数

一、引用 1、初步理解 引用在语法上的理解就是起别名&#xff0c;用法就是在类型后面加&&#xff0c;例子&#xff1a;int a 1; int& b a; 上例所示&#xff0c;执行后&#xff0c;b就是a的别名&#xff0c;它们代表同一块空间&#xff0c;a的改变会影响b&#xff0…

进阶JAVA篇-如何理解作为参数使用的匿名内部类与 Arrays 类的常用API(九)

目录 目录 API 1.0 Arrays 类的说明 1.1 Arrays 类中的 toString() 静态方法 1.2 Arrays 类中的 copyOfRange(int[] original, int from, int to) 静态方法 1.3 Arrays 类中的 copyOf(int[] original, int newLength) 静态方法 1.4 Arrays 类中的 setAll(do…

深入了解桶排序:原理、性能分析与 Java 实现

桶排序&#xff08;Bucket Sort&#xff09;是一种排序算法&#xff0c;通常用于将一组数据分割成有限数量的桶&#xff08;或容器&#xff09;&#xff0c;然后对每个桶中的数据进行排序&#xff0c;最后将这些桶按顺序合并以得到排好序的数据集。 桶排序原理 确定桶的数量&am…

Unity中用序列化和反序列化来保存游戏进度

[System.Serializable]标记类 序列化 [System.Serializable]是一个C#语言中的属性&#xff0c;用于标记类&#xff0c;表示该类的实例可以被序列化和反序列化。序列化是指将对象转换为字节流的过程&#xff0c;以便可以将其保存到文件、数据库或通过网络传输。反序列化则是将字…

C++桶排序算法的应用:存在重复元素 III

题目 给你一个整数数组 nums 和两个整数 indexDiff 和 valueDiff 。 找出满足下述条件的下标对 (i, j)&#xff1a; i ! j, abs(i - j) < indexDiff abs(nums[i] - nums[j]) < valueDiff 如果存在&#xff0c;返回 true &#xff1b;否则&#xff0c;返回 false 。 示例…

日志技术快速入门

1、创建Maven项目 这里不再说如何创建Maven项目 2、导入相关依赖 <dependency><groupId>ch.qos.logback</groupId><artifactId>logback-classic</artifactId><version>1.2.12</version></dependency>3、创建配置文件 在re…

嵌入式系统学习路径:

嵌入式系统学习路径&#xff1a; 00001. 确保扎实的C语言基础&#xff0c;包括高级编程知识和数据结构算法。 00002. 00003. 学习Linux应用层开发&#xff0c;包括并发程序设计、网络编程和数据库开发。 00004. 00005. 探索无线通信领域&#xff0c;如Zigbee、低功…