前端用docker部署

news2024/11/5 7:24:38

1、环境检查

首先需要确认服务器上是否已经安装docker了。
在服务器上执行docker -v
在这里插入图片描述
显示对应的版本号说明已经安装好了docker

2、部署

使用Docker部署若依项目的前端服务,我们最终实现的是:启动一个镜像,我们的整个前端就启动了,想要修改nginx配置,直接挂载下目录修改即可。

2.1传统部署方法

如果我们不用docker部署,我们会怎样部署前端项目呢?

  • 项目打成dist文件
  • 上传服务器
  • 下载nginx(docker下载或者压缩包安装)
  • 配置nginx的端口转发

感觉好麻烦,这里将使用docker进行部署,打成一个镜像包:

2.2制作镜像

我们的前端项目是利用nginx启动的,所以我们先将前端这个项目打包成dist文件,上传到服务器,然后编写dockerfile以及nginx配置文件,将dist文件和nginx配置文件copy到容器内部。最后打包测试。

2.1.1打包ruoyi-ui文件

下载若依项目,然后进入到ruoyi-ui这个工程,根据文档使用 npm run build:prod打包项目
在这里插入图片描述
这里最终会出现一个dist文件
在这里插入图片描述

2.1.2服务器上创建目录

mkdir /ruoyi/docker-nginx -p
相对应的目录如下:

├── default.conf #nginx配置
├── dist # ruoyi-ui打包文件
└── Dockerfile
2.1.3Nginx配置文件编写

使用vim创建一个 default.conf 文件
nginx配置文件:主要配置域名和端口转发,点我查看文档,内容如下:

server {
    listen       80;
    server_name  localhost;

    location / {
            root   /data/dist;
            index  index.html index.htm;
                 try_files $uri $uri/ /index.html;
    }

   location /prod-api/ {
      proxy_pass  http://127.0.0.1:8080/; # 转发规则 修改你服务器上的后端地址
      proxy_set_header Host $proxy_host; # 修改转发请求头,让8080端口的应用可以受到真实的请求
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

2.1.4Dockerfile文件编写
FROM nginx
MAINTAINER xiuyi/kid0510z@163.com
ENV RUN_USER nginx
ENV RUN_GROUP nginx
ENV DATA_DIR /data/dist
ENV LOG_DIR /data/log/nginx
RUN mkdir /data/log/nginx -p
RUN chown nginx.nginx -R /data/log/nginx
ADD dist /data/dist
ADD default.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
ENTRYPOINT nginx -g "daemon off;"

3.构建测试

docker build -t ruoyi-vue .
docker run -p 8088:80 --name ruoyi-vue ruoyi-vue

4.验证

访问ip+8088,如下表示成功:
在这里插入图片描述

5.完结

注意:如果使用的是docker部署的nginx ,应该先把nginx 进行关闭!!!!!
在这里插入图片描述

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

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

相关文章

Matlab实现白鲸优化算法(BWO)求解路径规划问题

目录 1.内容介绍 2.部分代码 3.实验结果 4.内容获取 1内容介绍 白鲸优化算法(BWO)是一种受自然界白鲸捕食行为启发的新型优化算法,它通过模拟白鲸的群体捕猎策略和社会互动来探索问题的最优解。BWO因其强大的全局搜索能力和高效的局部搜索能…

CPU 中央处理器调优

文章目录 1.1 CPU处理方式:1.2 查看CPU一秒钟有多个切换多少次。1.3 调整进程优先级使用更多CPU1.4 CPU亲和力1.5 CPU 性能监控1.6 CPU 利用率比例分配: 1.1 CPU处理方式: 批处理,顺序处理请求。(切换次数少,吞吐量大…

C#:强大而优雅的编程语言

在当今的软件开发领域,C#作为一种广泛应用的编程语言,以其强大的功能、优雅的语法和丰富的生态系统,受到了众多开发者的喜爱。本文将深入探讨 C#的各个方面,展示它的魅力和优势。 一、C#的历史与发展 C#是由微软公司开发的一种面…

信息安全工程师(74)网络安全风险评估技术方法与工具

前言 网络安全风险评估是依据有关信息安全技术和管理标准,对网络系统的保密性、完整性、可控性等安全数据进行科学评价的过程。 一、网络安全风险评估技术方法 风险评估程序 资产评估:确定需要保护的资源。威胁评估:确定可能对资产造成危害的…

【InfluxDB】InfluxDB 2.x基础概念及原理

InfluxDB简介 什么是时序数据库 时序数据库,全称时间序列数据库(Time Series Database,TSDB),用于存储大量基于时间的数据。时序数据库支持时序数据的快速写入、持久化,多维度查询、聚合等操作&#xff0…

sparkSQL面试题

一、查询所有数学课程成绩大于语文课程成绩的学生学号 数据 1,yuwen,43 1,shuxue,55 2,yuwen,77 2,shuxue,88 3,yuwen,98 3,shuxue,65 3,yingyu,88 基本步骤: 进行行转列比较语文与数学的成绩 SQL代码: with t1 as(SELECT id,sum(if(name yuwen,sc…

金融标准体系

目录 基本原则 标准体系结构图 标准明细表 金融标准体系下载地址 基本原则 需求引领、顶层设计。 坚持目标导向、问题导向、结果 导向有机统一,构建支撑适用、体系完善、科学合理的金融 标准体系。 全面系统、重点突出。 以金融业运用有效、保护有力、 管理高…

Spring Boot解决 406 错误之返回对象缺少Getter/Setter方法引发的问题

目录 前言1. 问题背景2. 问题分析2.1 检查返回对象 3. 解决方案3.1 确保Controller返回Result类型3.2 测试接口响应 4. 原理探讨5. 常见问题排查与优化建议结语 前言 在Spring Boot开发中,接口请求返回数据是系统交互的重要环节,尤其在开发RESTful风格的…

如何自学机器学习?

自学机器学习可以按照以下步骤进行: 一、基础知识准备 数学基础: 高等数学:学习微积分(包括导数、微分、积分等)、极限、级数等基本概念。这些知识是后续学习算法和优化方法的基础。 线性代数:掌握矩阵…

SQL,力扣题目1709,访问日期之间最大的空档期

一、力扣链接 LeetCode_1709 二、题目描述 表: UserVisits ------------------- | Column Name | Type | ------------------- | user_id | int | | visit_date | date | ------------------- 该表没有主键,它可能有重复的行 该表包含用户访问…

C# 日志框架 NLog、log4net 和 Serilog对比

文章目录 前言NLog、log4net 和 Serilog 三个框架的详细对比:一、NLog优点:缺点:二、 log4net优点缺点三、Serilog优点缺点四、Serilog使用举例总结前言 NLog、log4net 和 Serilog 三个框架的详细对比: NLog、log4net 和 Serilog 是三个非常流行的 .NET 日志框架,它们各自…

电路设计过程就是波形整形过程

这种说法有一定的道理。在电路设计中,常常需要对输入的电信号波形进行处理和调整,以满足后续电路或系统的要求,这在某种程度上可以理解为波形整形的过程。 例如,在数字电路中,输入的信号可能存在噪声、干扰或者不符合…

系统架构设计师(软考高级)一站式通关课程

系统架构设计师(软考高级) 一站式通关课程 系统架构设计师(软考高级)教程(三连评论分享链接!) 🎯 课程亮点: 全面覆盖: 从基础概念到高级应用,涵盖…

源码阅读心得---如何从零开始阅读一个框架的源码

写在前头,菜鸟作者的一些碎碎念: 回想自己2022年研三第一次去实习的时候,是到了一个数据库小组,是一个做数据库内核的小组,leader分配的目标是先把read/write流程搞明白。第一次出校实习,一来就是直接读内核…

Java项目实战II基于Java+Spring Boot+MySQL的体育馆使用预约平台的设计与实现(源码+数据库+文档)

目录 一、前言 二、技术介绍 三、系统实现 四、文档参考 五、核心代码 六、源码获取 全栈码农以及毕业设计实战开发,CSDN平台Java领域新星创作者,专注于大学生项目实战开发、讲解和毕业答疑辅导。获取源码联系方式请查看文末 一、前言 随着全民健…

创新材料科技:铜冷却壁助力高炉节能降耗

高炉用铜冷却壁是高炉内部的一种构件,通常用于高炉的炉身部分。它的主要功能是在高炉冶炼过程中冷却炉壁,以防止炉壁过热。铜冷却壁通常由铜制成,因为铜具有良好的导热性和耐腐蚀性,能够有效地将热量从高炉内部传导到外部&#xf…

衡石分析平台最佳实践-开发场景之分层级嵌入

分层级嵌入 平台整体嵌入 在这种应用场景中&#xff0c;把所有功能通过 iframe 的方式都开放给登陆用户&#xff0c;嵌入的示例如下&#xff1a; html <iframename""src"https://preview.hengshi.com/app/1"> </iframe> 1 2 3 4 单个模…

Balluff EDI 项目需求分析

电子数据交换&#xff08;EDI&#xff0c;Electronic Data Interchange&#xff09;是一种通过电子方式在不同组织之间交换商业文档的技术和标准。它涉及使用标准格式的电子文档&#xff0c;如订单、发票、运输单据等&#xff0c;以实现自动化的数据传输。这种技术通常依赖于专…

C++ 手写常见的任务定时器

序言 最近在编写 C 的服务器代码时&#xff0c;我遇到了一个需求&#xff0c;服务器很可能会遇到那些长期不活跃的连接&#xff0c;这些连接占用了一定的资源但是并没有进行有效的通信。为了优化资源使用&#xff0c;我决定实现一个定时器&#xff0c;以便定期检查连接的活跃状…