项目部署(前后端)

一:多环境概念:

借鉴来源:多环境设计_程序员鱼皮-多环境设计-CSDN博客

为什么需要多环境:

第一个例子:我们可以设想,我们肯定玩过王者荣耀,且王者荣耀也一直在不断更新,如果按我们以前的思想,一个项目如果一直在做更新,那项目肯定会不稳定,上线用户也无法使用。

第二个例子:如果本地和线上项目同时操控一个数据库,显而易见:开发人员和用户肯定不能同时操作数据库。

从上面这两个例子中差不多就可以推断出为什么需要多环境了,

多环境就是:根据实际需要,对项目阶段进行部署,相互独立且互相不影响。

多环境的分类:

  1. 本地环境(自己的电脑)localhost(熟悉的localhost)
  2. 开发环境:公司连同一台机器,方便开发
  3. 测试环境:性能测试/功能测试/系统集成测试
  4. 预发布环境(体验服):用正式服的数据再进行测试
  5. 正式环境(线上,公开访问的项目)
  6. 沙箱环境:目的就是为了做实验(做完就销毁)

前端配置多环境:

前端配置我直接一ant design pro的项目举例(本人对前端了解甚少)

1:请求地址:
  • 开发环境:localhost:8000
  • 线上环境:user-backend.code-nav.cn
2:启动方式:

npm run start 通常用于启动开发服务器或者应用程序的开发模式。这个命令一般会启动一个开发服务器,监听文件变化并自动重新加载应用,以方便开发人员在开发过程中进行实时调试。这个命令通常用于开发阶段,不会对代码进行优化和压缩,以便开发人员能够方便地调试和查看代码变化。

npm run build 通常用于构建生产环境下的部署包。这个命令会对项目代码进行优化、压缩和打包,以减小文件大小并提高运行效率。通常会生成用于部署的静态文件,准备好被部署到生产服务器上。这个命令一般在项目准备发布时执行,以确保发布的代码是经过优化和压缩的

3:项目的配置:
不同的项目(框架)都有不同的配置文件,umi 的配置文件是 config,可以在配置文件后添加对应的环境名称后缀来区分开发环境和生产环境。参考文档:https://umijs.org/zh-CN/docs/deployment
    • 开发环境:config.dev.ts
    • 生产环境:config.prod.ts
    • 公共配置:config.ts 不带后缀

首先我们需要知道,当我们使用umi框架的时候,build 时会自动传入 NODE_ENV == production 参数

所以我们的思路可是是什么呢

我们可以在前端的拦截器上加一个判断条件,如果NODE_ENV是等于这个prod的,我们就转到我们想要转的地址(user-backend.code-nav.cn)

const request = extend({
  credentials: 'include', // 默认请求是否带上cookie
  prefix: process.env.NODE_ENV === 'production' ? 'http://user-backend.code-nav.cn' : undefined
  // requestType: 'form',
});

 一般上线的话,需要运行build 进行打包构建,然后生成一个dist文件

可以使用 serve 工具启动(npm i -g serve),浏览打包好了的文件 

 

这个时候我们点开这个3000,我们就可以进入我们的prod环境了。 

 

后端配置多环境: 

后端和前端一样都需要配置文件:

SpringBoot 项目,通过 application.yml 添加不同的后缀来区分配置文件

这里鱼皮是用了一个线上的数据库来做测试,无奈没钱买,只能自己重新创了一个数据库。

这里我建了两个数据库,一个user是一开始开发时候使用的,一个user-prod是测试prod环境使用的。

然后我们运行maven中的package,对项目进行打包
这里有个小插曲

就是package的时候,我们出现了报错,报错提示:是我们的单元测试中有问题,

这个时候我们就可以进行考虑了,如果这个单元测试不重要,我们就可以点击跳过测试模式这个按钮。

 打包完之后,我们在这个打包出来的文件夹(target)的终端中输入

java -jar .\user-center-backend-0.0.1-SNAPSHOT.jar --spring.profiles.active=prod

那一行代码的意思就是往里传了一个环境参数,让前端去访问 user-prod那个数据库

经过测试每啥问题。

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

cleanmymac清理时要一直输入密码 CleanMyMac X一直提示输入密码的解决方案

CleanMyMac X是一款专业的Mac清理软件,可智能清理mac磁盘垃圾和多余语言安装包,快速释放电脑内存,轻松管理和升级Mac上的应用。同时CleanMyMac X可以强力卸载恶意软件,修复系统漏洞,一键扫描和优化Mac系统。 在使用Cle…

【人工智能基础学习】Andrew Ng-机器学习基础笔记

⭐️我叫忆_恒心,一名喜欢书写博客的研究生👨‍🎓。 如果觉得本文能帮到您,麻烦点个赞👍呗! 近期会不断在专栏里进行更新讲解博客~~~ 有什么问题的小伙伴 欢迎留言提问欧,喜欢的小伙伴给个三连支…

HyperSnap软件最新版下载-HyperSnap官方最新版附加详细安装步骤

​HyperSnap是一个老牌优秀的屏幕截图工具,全新界面,不仅能抓取标准桌面程序,还能抓取 DirectX, 3Dfx Glide的 游戏视频或 DVD 屏幕图,能以 20 多种图形格式(包括:BMP, GIF,JPEG, TIFF, PCX等)保…

鸿蒙开发:应用组件跨设备交互(流转)【跨端迁移】

跨端迁移 概述 在用户使用设备的过程中,当使用情境发生变化时(例如从室内走到户外或者周围有更适合的设备等),之前使用的设备可能已经不适合继续当前的任务,此时,用户可以选择新的设备来继续当前的任务&a…

C盘爆满?教你轻松清理无故产生的大量临时文件!

在电脑操作中,用户发现自己系统C盘爆满了,无缘无故产生了大量的临时文件,导致电脑运作变得卡顿,但不知道要怎么操作才能解决这个问题?接下来小编给小伙伴们带来不同的解决方法,轻松清理电脑上的临时文件。 …

【lesson7】服务端业务处理模块实现

文章目录 业务处理实现思路业务处理类设计成员变量成员函数RunModuleupLoadlistShowdownLoadgetETagInfo 业务处理实现思路 云备份项目中 ,业务处理模块是针对客户端的业务请求进行处理,并最终给与响应。而整个过程中包含以下要实现的功能: …

这所大学25考研计算机学院专业课已全面改考为408!南京信息工程大学计算机考研!

南京信息工程大学(Nanjing University of Information Science and Technology),简称“南信大”,位于江苏省南京市,是一所以大气科学为特色的全国重点大学,由江苏省人民政府、中华人民共和国教育部、中国气…

【lesson1】第三方库(jsoncpp,bundle, httplib)的介绍和使用

文章目录 jsoncpp库json 认识jsoncpp 认识jsoncpp 实现序列化jsoncpp 实现反序列化 bundle库bundle库实现文件压缩bundle库实现文件解压缩 httplib 库httplib 库搭建简单服务器httplib库搭建简单客户端 jsoncpp库 json 认识 json 是一种数据交换格式,采用完全独立…

OS进程取样器OS Process Sampler执行CMD/Shell命令

Apache JMeter - Users Manual: Component Reference 1.背景 项目上最近需要测试一种很少用到的DICOM协议,但是网上资料很少,基本上可以总结为三种方案: 直接发送TCP 16进制数据包,但是参数化数据准备难度大通过开发封装jar包发送,需要开发组提供通过发送cmd命令给前置机…

ES升级--05--快照生成 和备份

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 备份ES数据1.关闭集群自动均衡2.执行同步刷新3.停止集群节点的Elasticsearch服务4.修改Elasticsearch配置文件,开启快照功能,配置仓库目录为…

java:FeignClient通过RequestInterceptor自动添加header

示例代码 【pom.xml】 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</artifactId><version>2.3.12.RELEASE</version> </dependency> <dependency><groupId>o…

f-stack和DPDK

GPT-4 (OpenAI) f-stack和DPDK&#xff08;数据平面开发套件&#xff09;都是与高性能网络处理相关的技术。它们的目的是提高数据包的处理速度&#xff0c;优化网络I/O的性能。以下是对这两者的简要解释&#xff1a; 1. **DPDK (Data Plane Development Kit):** DPDK 是一个…

柯桥成人外语培训|职场商务英语剑桥国际英语口语外贸商务英语

01 “puppy love”是什么意思&#xff1f; 大家都知道&#xff0c;puppy有“幼犬&#xff0c;小狗”的意思&#xff0c;love是“爱”&#xff0c;那puppy love是什么意思呢&#xff1f;可不是字面上表达的小狗的爱哦&#xff01; 其实&#xff0c;"puppy love"真正的…

轻松实现App推广代理结算,Xinstall超级渠道功能助您一臂之力!

在App推广的广阔天地中&#xff0c;与渠道方建立合作关系&#xff0c;共同实现用户增长和品牌提升&#xff0c;已成为众多开发者和广告主的共识。然而&#xff0c;如何高效管理这些渠道、监测推广效果、实现代理结算&#xff0c;一直是困扰大家的难题。今天&#xff0c;我们就来…

P4. 微服务: 匹配系统(上)

P4. 微服务: 匹配系统 上 Tips0 概述1 匹配系统流程2 游戏系统流程3 websocket 前后端通信的基础配置3.1 websocket 的需要的配置3.2 websocket 连接的建立3.3 为 websocket 连接添加 jwt 验证 4 实现匹配界面和对战界面的切换5 匹配系统的客户端和 websocket 后端交互部分5.1 …

Spark的开发环境配置

1. 介绍 这里主要记录一下&#xff0c;我们常用的maven配置&#xff0c;方便后期开发配置环境&#xff0c;避免每次都从零开始配置工程。 2. 工程目录 3. pom的配置 <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven…

Leetcode学习

回文数 反转一半数字 第一个想法是将数字转换为字符串&#xff0c;并检查字符串是否为回文。 但是&#xff0c;这需要额外的非常量空间来创建问题描述中所不允许的字符串。 第二个想法是将数字本身反转&#xff0c;然后将反转的数字与原始数字比较&#xff0c;如果它们是相同…

【课程总结】Day6(下):机器学习项目实战–成人收入预测

机器学习项目实战&#xff1a;成人收入预测 项目目的 基于个人收入数据(包括教育程度、年龄、性别等)的数据集&#xff0c;通过机器学习算法&#xff0c;预测一个人的年收入是否超过5万美金。 数据集 地址&#xff1a;http://idatascience.cn/dataset-detail?table_id10036…

HJS-DE1/3断电延时时间继电器 导轨安装 约瑟JOSEF

​HJS-DE断电延时时间继电器 HJS-DE1/3断电延时时间继电器 HJS-DE1/2断电延时时间继电器 HJS-DE断电延时时间继电器 用途 时间继电器HJS-DE1/3作为通电立即动作断电延时返回的元件&#xff0c;用于交流或直流保护和自动控制装置中&#xff0c;使被控元件得到所需延时。本继电…

MySQL系列-语法说明以及基本操作(一)

1、前言 主要讲解MySQL的基本语法 官网文档 https://docs.oracle.com/en-us/iaas/mysql-database/doc/getting-started.html 关于MySQL的基本语法&#xff0c;关于数据类型、表的操作、数据操作、事务、备份等&#xff0c;可参考 http://www.voidme.com/mysql 2、数据类型 数…