修复:使用动态主机地址支持局域网内后端服务访问

Updated iframe source URLs to use the window's hostname instead of localhost.本次提交解决了局域网内其他设备无法正常访问后端服务的问题。此前前端代码中硬编码了localhost作为后端服务的主机地址,导致其他设备访问时,localhost会指向设备自身而非实际运行服务的主机,从而无法连接后端。
主要修改内容:
将前端中硬编码的localhost替换为window.location.hostname,动态获取当前页面的主机 IP(即运行服务的电脑局域网 IP)。
涉及修改的关键位置:
preloadIframes函数:预加载 iframe 时,使用动态主机地址生成后端服务 URL(如http://${window.location.hostname}:8501)。
performSearch函数:发送搜索请求时,同样使用动态主机地址构建请求 URL,确保后端接口调用正确指向服务主机。
注意事项:
为确保局域网访问正常,后端服务(运行在 8501、8502、8503 等端口)需配置为绑定到0.0.0.0(而非默认的localhost),以允许来自局域网的连接。例如,Python 服务可通过app.run(host='0.0.0.0', port=8501)启动。
效果:
修改后,局域网内其他设备通过服务主机的局域网 IP(如192.168.1.100)访问前端页面时,可自动正确连接到后端服务,实现跨设备正常使用。
This commit is contained in:
Mingxiangyu
2025-10-28 14:16:52 +08:00
committed by BaiFu
parent b1ec4762cb
commit f6d52b90f0

View File

@@ -1002,7 +1002,7 @@
totalRunning++;
// 构建搜索URL
const searchUrl = `http://localhost:${ports[app]}?query=${encodeURIComponent(query)}&auto_search=true`;
const searchUrl = `http://${window.location.hostname}:${ports[app]}?query=${encodeURIComponent(query)}&auto_search=true`;
console.log(`${app} 发送搜索请求: ${searchUrl}`);
// 直接更新主iframe的src来传递搜索参数
@@ -1206,7 +1206,7 @@
for (const [app, port] of Object.entries(ports)) {
const iframe = document.createElement('iframe');
iframe.src = `http://localhost:${port}`;
iframe.src = `http://${window.location.hostname}:${port}`;
iframe.style.width = '100%';
iframe.style.height = '100%';
iframe.style.border = 'none';