case-data-admin/ENV_CHANGES_SUMMARY.md
2025-08-11 11:41:22 +08:00

3.5 KiB
Raw Blame History

环境配置修改总结

修改概述

根据用户需求已成功实现自动环境检测功能系统能够自动判断当前环境并使用相应的API地址

  • 本地环境: 自动使用 http://127.0.0.1:5480
  • 开发服务器环境: 自动使用 http://dev-casedata.igandan.com:5480
  • 其他环境: 使用配置文件中的 VITE_APP_API_URL

具体修改内容

1. 新增文件

src/utils/env-util.js

  • 创建环境检测工具
  • 实现自动环境判断逻辑
  • 提供 detectEnvironment()getCurrentApiUrl() 函数

src/utils/env-test.js

  • 创建环境检测测试文件
  • 提供测试函数 testEnvironmentDetection()
  • 在开发环境下自动加载,方便调试

.env.dev-server

  • 新增开发服务器环境配置文件
  • API地址: http://dev-casedata.igandan.com:5480

ENV_README.md

  • 详细的环境配置使用说明文档

ENV_CHANGES_SUMMARY.md

  • 本修改总结文档

2. 修改文件

src/lib/axios.js

  • 引入环境检测工具
  • baseURL 从静态配置改为动态检测: getCurrentApiUrl()

package.json

  • 新增 build:dev-server 构建命令

src/main.js

  • 在开发环境下自动引入环境检测测试文件

环境配置文件

  • .env.localhost: 端口从5478改为5480
  • .env.development: 端口从5478改为5480
  • .env.test: 端口从5478改为5480

环境检测逻辑

本地环境检测

// 检测以下主机名或IP地址
hostname === 'localhost' || 
hostname === '127.0.0.1' || 
hostname === '0.0.0.0' ||
hostname.includes('192.168.') ||
hostname.includes('10.') ||
hostname.includes('172.')

开发服务器环境检测

// 检测特定域名
hostname === 'dev-casedata.igandan.com'

优先级

  1. 环境检测 (最高优先级)
  2. 配置文件 (中等优先级)
  3. 默认值 (最低优先级)

使用方法

开发时

# 本地开发 - 自动使用 127.0.0.1:5480
npm run localhost

# 开发环境 - 自动使用 127.0.0.1:5480
npm run dev

部署时

# 部署到开发服务器 - 自动使用 dev-casedata.igandan.com:5480
npm run build:dev-server

# 其他环境
npm run build:test
npm run build:pre
npm run build:prod

测试验证

控制台测试

在开发环境下,打开浏览器控制台,运行:

testEnv()

预期结果

  • 本地环境: API地址显示为 http://127.0.0.1:5480
  • 开发服务器环境: API地址显示为 http://dev-casedata.igandan.com:5480

技术特点

  1. 零配置: 无需手动修改任何代码,系统自动判断环境
  2. 智能检测: 基于主机名、IP地址、环境变量等多维度检测
  3. 端口统一: 所有环境都使用5480端口
  4. 向后兼容: 不影响现有的环境配置文件
  5. 开发友好: 提供测试工具和详细文档

注意事项

  1. 端口配置: 确保后端服务在5480端口运行
  2. 域名配置: 确保 dev-casedata.igandan.com 域名正确解析
  3. 环境变量: 开发环境下会自动加载测试文件
  4. 构建命令: 使用正确的构建命令来部署到不同环境

完成状态

环境检测工具 - 已完成
自动API地址配置 - 已完成
端口统一为5480 - 已完成
环境配置文件更新 - 已完成
构建命令添加 - 已完成
测试工具 - 已完成
文档说明 - 已完成

所有修改已完成系统现在能够自动判断环境并使用相应的API地址