JeecgBoot项目积木BI预览设计问题排查与解决方案

问题背景

在JeecgBoot 3.7.1版本中，当项目部署到生产环境后，积木报表功能可以正常使用，但积木BI模块在点击设计或预览仪表板/大屏时出现接口请求不通的问题。该问题特别出现在通过Nginx反向代理访问的场景下，而直接访问后端服务端口则功能正常。

问题现象

1. 积木报表功能正常访问，URL格式为：/dentao-api/jmreport/index/报表ID
2. 积木BI设计/预览功能异常，URL格式为：/dentao-api/drag/index?pageId=页面ID
3. 直接访问后端服务端口(如34567)时功能正常
4. 通过Nginx代理访问时，积木BI设计预览功能失效

技术分析

Nginx代理配置问题

原始Nginx配置中使用了以下设置：

location /dentao-api {
    proxy_pass http://127.0.0.1:34567/dentao-api;
    proxy_redirect off;
    proxy_set_header X-Forwarded-Scheme $scheme;
    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 Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
}

问题出在proxy_set_header Host $host这一行配置上。该配置会导致后端服务接收到的Host头部不包含端口信息，而积木BI模块在处理设计/预览请求时，可能依赖完整的Host信息(包含端口)来构建返回的URL地址。

问题本质

积木BI模块在设计/预览功能中，会生成包含完整URL的响应。当Nginx代理不传递端口信息时：

1. 后端服务无法得知客户端实际访问的端口
2. 生成的响应URL中端口信息缺失(默认为80端口)
3. 前端获取的URL与实际访问URL不一致
4. 导致后续请求发送到错误的地址

解决方案

修改Nginx配置，在Host头部中包含端口信息：

proxy_set_header Host $host:$server_port;

这一修改确保：

1. 后端服务能获取到客户端实际访问的端口
2. 积木BI生成的响应URL包含正确的端口信息
3. 前端后续请求能正确发送到代理地址

深入理解

Nginx代理与Host头部

在HTTP反向代理中，Host头部扮演着重要角色：

1. 标识客户端实际请求的主机和端口
2. 影响后端服务生成的绝对URL
3. 对于需要重定向或生成链接的应用至关重要

JeecgBoot积木BI的特殊性

积木BI模块相比积木报表：

1. 更依赖完整的URL信息来构建设计器环境
2. 可能使用了更多绝对路径的API调用
3. 设计预览功能涉及复杂的前后端交互

最佳实践建议

1. 在生产环境部署时，始终测试代理前后的功能一致性
2. 对于需要生成URL的后端应用，确保代理传递完整的Host信息
3. 考虑使用以下Nginx配置组合：

   proxy_set_header Host $host:$server_port;
   proxy_set_header X-Forwarded-Host $host:$server_port;
   proxy_set_header X-Forwarded-Port $server_port;
   

4. 对于复杂的前后端分离应用，建议在前端配置中明确指定API基础URL

总结

JeecgBoot项目中积木BI模块的设计预览功能在生产环境下的异常，本质上是由于Nginx代理配置不完整导致的URL生成问题。通过调整Host头部的传递方式，包含端口信息，可以完美解决这一问题。这提醒我们在部署复杂Web应用时，需要特别注意代理配置对应用行为的影响，特别是当应用涉及URL生成和重定向时。