超图服务地址配置 - 打包后动态修改

概述

现在超图服务地址支持打包后通过外部配置文件修改，无需重新打包即可适配不同的部署环境。

配置文件位置

打包后的配置文件位于：dist/supermap.config.js

使用方法

1. 打包前端

npm run build:prod

打包后会在 dist 目录生成 supermap.config.js 文件。

2. 部署到不同环境

环境A部署： 编辑 dist/supermap.config.js：

window.SUPERMAP_CONFIG = {
  host: '192.168.1.100',
  port: '8090'
}

环境B部署： 编辑 dist/supermap.config.js：

window.SUPERMAP_CONFIG = {
  host: '192.168.2.200',
  port: '8090'
}

3. 验证配置

启动应用后，浏览器控制台会显示：

超图服务配置: { source: "外部配置文件", host: "192.168.1.100", port: "8090", baseUrl: "http://192.168.1.100:8090" }

配置项说明

配置项	说明	示例
`host`	超图服务器地址	`'192.168.1.100'`
`port`	超图服务器端口	`'8090'`
`baseUrl`	完整地址（可选）	`'http://192.168.1.100:8090'`
`tiandituKey`	天地图Key（可选）	`'your_key'`

配置优先级

外部配置文件 (supermap.config.js) - 最高优先级
环境变量 (.env.production)
默认值 (localhost:8090)

不同部署场景示例

场景1：局域网部署

window.SUPERMAP_CONFIG = {
  host: '192.168.1.100',
  port: '8090'
}

场景2：公网部署

window.SUPERMAP_CONFIG = {
  baseUrl: 'http://supermap.example.com:8090'
}

场景3：HTTPS部署

window.SUPERMAP_CONFIG = {
  baseUrl: 'https://supermap.example.com'
}

注意事项

1. 文件位置

开发环境：public/supermap.config.js
打包后：dist/supermap.config.js
必须与 index.html 在同一目录

2. 修改时机

✅ 可以在打包后、部署前修改
✅ 可以在已部署的服务器上修改（需要重启Web服务器）
❌ 不能在应用运行时修改（需要刷新页面）

3. 缓存问题

如果修改配置后未生效，可能是浏览器缓存：

清除浏览器缓存
或在URL后添加 ?v=时间戳

4. 文件权限

确保Web服务器有读取 supermap.config.js 的权限：

Linux: chmod 644 supermap.config.js
Windows: 确保IIS用户有读取权限

部署工作流

标准流程

# 1. 打包
npm run build:prod

# 2. 部署到服务器
scp -r dist/* user@server:/var/www/html/

# 3. 登录服务器
ssh user@server

# 4. 修改配置
vi /var/www/html/supermap.config.js

# 5. 重启Web服务器（可选）
systemctl restart nginx

多环境部署

部署脚本示例：

#!/bin/bash
# deploy.sh

ENV=$1

if [ "$ENV" == "prod" ]; then
    HOST="192.168.1.100"
elif [ "$ENV" == "test" ]; then
    HOST="192.168.2.200"
else
    HOST="localhost"
fi

# 修改配置文件
sed -i "s/host: '.*'/host: '$HOST'/" dist/supermap.config.js

# 部署
rsync -avz dist/ user@server:/var/www/html/

使用：

./deploy.sh prod   # 部署到生产环境
./deploy.sh test   # 部署到测试环境

故障排查

问题1：配置不生效

检查步骤：

确认文件路径正确
检查文件内容是否正确
清除浏览器缓存
查看浏览器控制台日志

问题2：404错误

检查：

确认文件在正确位置
确认Web服务器配置正确

问题3：跨域问题

如果超图服务器与应用不在同一域名，需要：

配置超图服务器CORS
或使用Nginx反向代理

开发环境

开发环境默认使用 public/supermap.config.js，可以修改此文件进行本地测试。

也可以使用 .env.development 配：

VITE_SUPERMAP_HOST=localhost
VITE_SUPERMAP_PORT=8090

总结

通过外部配置文件，您现在可以：

✅ 一次打包，多环境部署
✅ 无需修改代码即可更改超图服务地址
✅ 便于自动化部署和CI/CD集成
✅ 降低部署复杂度和出错风险

超图服务外部配置使用说明.md 4.1 KB История Исходник