多环境
本地开发:localhost(127.0.0.1),项目在此电脑运行,使用本机地址可访问项目。
项目上线:让前端不在请求localhost的地址,而是请求后端项目部署的地址域名。
理论知识
1. 什么是多环境:
指同一套项目代码,在不同的阶段需要跟不同情况,来调整配置,部署到不同的机器上。
2. 为什么需要多环境:针对不同环境做不同的事情
- 每个环境互不影响
- 为了区分不同的阶段:开发/测试/生成环境
- 对项目进行优化:如开发阶段的本地日志,在生产环境需隐藏在,为了确保安全。精简依赖(减少项目体积),项目的环境/参数可以调整如jvm参数。
3. 多环境的分类
1. 本地环境(自己的电脑)localhost
2. 开发环境(远程开发)所有人连同一台机器,为了大家开发的便利性
3. 测试环境(测试)开发/测试/产品体验,性能测试/功能测试/系统集成测试,独立数据库,独立服务器等
4. 预发布环境(体验服):和正式环境一致,正式的数据库。可以更严谨一些查出更多问题。
5. 正式环境:线上,公开对外访问的项目,尽量避免改动。保证线上环境完美运行
6. 沙箱环境(实验环境):为了验证某个功能单独的一个实验环境
实践(将本地项目上线公开)
1.前端多环境配置
-
请求地址
- 开发环境:loclahost:8080
- 线上环境:user-backend.code-nav.cn
- 怎么使用一套代码完成两个地址的访问的需求:startFrom(env){ },根据传入此函数中不同的参数来区分不同的地址。
如果使用umi框架,build时会自动转入NODE ENV==production参数,start NODE ENV ==startFrom(env){ if(evn==="prod"){ //不输出注释 //项目优化 //修改请求地址 }else{ //保持本地开发逻辑 } }
-
启动方式
- 开发环境:npm run start(本地启动,监听端口,自动更新)
- 线上环境:npm run build (项目构建打包),每次构建出的dist文件可能都不一样,一般不上传到远程仓库,使用serve工具(可以使用npm install serve在本地安装)调试dist文件。需要做到线上的项目使用线上的后端,在全局请求类gloabalRequest.ts中做请求配置
-
项目配置
不同的项目(框架)有不同的配置问文件,umi的配置文件时config- 开发环境和生产环境可以根据在配置文件后添加对应的环境名称后缀来区分
- 开发环境:congig.dev.ts
- 生产环境:config.prod.ts
- 公共配置:cofig.ts
【注】前端静态化
页面静态化是指根据页面的路由,把每个路由都生成一个index.html的静态文件
2. 后端多环境配置
- 主要功能:提供注册和登录及其增删改查(数据存于mysql数据库)
- 项目上线:在上线的时候要把数据库的地址换成远程可访问的数据库,或者说自己部署的后端项目的服务器能访问到
- 如何区分环境:在配置文件后面增加一个后缀来区分。后端的配置文件为application.yml也是公共配置,因此可以在application-prod.yml中区分开发环境还是生产环境
- 在application-prod.yml中配置线上数据库,需要提前创建一个和本地相同的线上数据库数据表
spring: # DataSource Config datasource: driver-class-name: com.mysql.cj.jdbc.Driver url: '【线上数据库路径】' username: self password: ****** # session 失效时间 session: timeout: 86400 server: address: 0.0.0.0
- 总结,实现的主要步骤
- 依赖的环境地址
- 数据库地址
- 缓存地址
- 消息队列地址
- 项目端口号
- 服务器配置
- 依赖的环境地址