政府管理后台部署修复说明

问题描述

部署后前端仍然使用 http://localhost:5352 访问API，导致无法正常访问后端服务。

问题原因

前端代码中硬编码了本地开发环境的API地址，没有根据部署环境动态配置。

解决方案

1. 环境变量配置

已创建环境配置文件：

开发环境 (.env.development):

VITE_API_BASE_URL=http://localhost:5352/api
VITE_APP_TITLE=政府管理系统
VITE_APP_ENV=development

生产环境 (.env.production):

VITE_API_BASE_URL=https://ad.ningmuyun.com/api/government
VITE_APP_TITLE=政府管理系统
VITE_APP_ENV=production

2. API配置文件修改

已修改以下文件使用环境变量：

src/utils/api.js - 主要API配置
src/utils/productionMaterialCertificationApi.js - 生产物料认证API
src/utils/deviceWarningApi.js - 设备预警API
src/utils/cattleAcademyApi.js - 牛只学院API
src/utils/epidemicActivityApi.js - 疫情活动API
src/utils/approvalProcessApi.js - 审批流程API

3. 部署步骤

3.1 重新构建前端

cd government-admin

# 安装依赖
npm install

# 生产环境构建
npm run build

3.2 部署到服务器

将构建后的 dist 目录上传到服务器的 /var/www/html/government/ 目录。

3.3 验证Nginx配置

确保服务器上的Nginx配置正确：

# 政府端前端静态文件
location /government/ {
    alias /var/www/html/government/;
    try_files $uri $uri/ /government/index.html;
    index index.html;
}

# 政府端API代理
location ^~ /api/government/ {
    proxy_pass http://localhost:5352/api/government/;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
    
    # CORS配置
    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Methods 'GET, POST, PUT, DELETE, OPTIONS';
    add_header Access-Control-Allow-Headers 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range,Authorization';
    
    if ($request_method = 'OPTIONS') {
        return 204;
    }
}

3.4 重启服务

# 重新加载Nginx配置
sudo nginx -t
sudo nginx -s reload

# 确保government-backend服务运行
pm2 restart government-backend

4. 验证修复

访问以下地址验证修复结果：

前端页面: https://ad.ningmuyun.com/government/
API接口: https://ad.ningmuyun.com/api/government/departments

5. 注意事项

环境变量: 确保在生产环境构建时使用正确的环境变量
缓存清理: 部署后清理浏览器缓存
HTTPS证书: 确保SSL证书配置正确
防火墙: 确保端口443和80开放
服务状态: 确保government-backend服务正常运行

6. 故障排查

如果仍有问题，请检查：

浏览器开发者工具: 查看网络请求是否使用正确的URL
Nginx日志: 检查 /var/log/nginx/error.log
后端日志: 检查government-backend服务日志
端口监听: 确认5352端口正常监听

# 检查端口监听
netstat -tlnp | grep 5352

# 检查服务状态
pm2 status government-backend

# 测试API连通性
curl -k https://ad.ningmuyun.com/api/government/departments

3.3 KiB Raw Blame History Unescape Escape