记录一次内网UI报表部署踩坑（2026-05-25）

内网部署的坑，一半出在CDN，一半出在localhost。

今天从早到晚都在和工厂的UI报表较劲。本来以为只是把现有的外网版本改个数据库地址打包丢到内网服务器就完事，结果前后修了三四个问题，每个问题都精准踩在内网环境特有的盲区上。

一、需求：把UI打包进内网，配置全部指向10.103.x.x

早上接到的活儿很明确：UI报表要放到内网，整体打包成一个文件夹，数据库从原先的地址切到内网MySQL，服务器发布到10.103.54.6的8765端口，视频流地址也换成了内网FLV源。

数据库信息当时直接给了一串：10.103.50.147:3306，库名m3_ai_data，表work_load_0521，表结构不变。账号密码我直接写进了factory_api_server.py，这里就不贴明文了，反正后端连库用的配置全部改好。视频流地址是http://10.103.65.30:8080/live?port=1935&app=live&stream=M3_5643，后面要集成到前端播放器里。

第一版打包很快出炉，factory_dashboard_deploy文件夹一共7个文件：

factory_api_server.py：数据库改成10.103.50.147，账号密码已写
factory_dashboard_dark.html：集成FLV实时视频流
flv.min.js：144KB，本地播放器库，不依赖外网
aaa.png：产线监控封面图
requirements.txt：flask + flask-cors + pymysql
start_dashboard.bat：一键启动脚本
README.md：部署说明

部署步骤也简单：复制文件夹到服务器，跑start_dashboard.bat，访问http://10.103.54.6:8765。当时觉得稳了。

二、第一个坑：localhost 把访客带到了自己的电脑上

还没过多久，用户反馈：在10.103.54.6服务器本机访问没问题，但内网其他电脑打开页面一直停在“正在连接数据库...”，进不去。

我第一反应是后端API不通，但服务器本机能访问说明服务起来了。回去翻前端代码，果不其然，第705行：

1	var API_URL = 'http://localhost:8765/api/data';

问题一目了然。其他电脑访问时，浏览器下载HTML到本地执行，JS里的localhost指向的是访客自己的电脑，不是那台10.103.54.6服务器，所以所有API请求全部打到本机8765端口，自然连不上后端，页面就卡在“正在连接数据库...”。

修复动作是把localhost全部换成服务器内网IP，并且顺手把另一个相对路径请求也改了：

// 修复前
var API_URL = 'http://localhost:8765/api/data';
fetch('/api/dates')

// 修复后
var SERVER_BASE = 'http://10.103.54.6:8765';
var API_URL = SERVER_BASE + '/api/data';
fetch(SERVER_BASE + '/api/dates')

改完重新打包压缩，让用户解压覆盖到服务器目录，重启服务。这个坑算是填上了。

三、第二个坑：Plotly is not defined，又是CDN的锅

没消停多久，新反馈来了：UI界面载入后右下角弹“数据获取失败：Plotly is not defined 请确认 factory_api_server.py 已启动”。报错字面意思是让我确认后端进程，但我检查后端明明活着。真正原因是前端图表库Plotly没加载成功。

看了一眼HTML，Plotly原来是从外网CDN加载的。内网机器根本访问不了公网CDN，所以Plotly is not defined，图表初始化报错，然后前端逻辑误判成API失败，弹出了那个提示。

解决办法只有一个：把plotly库也下载到本地。我找到plotly-2.24.1.min.js，体积3.5MB，直接扔进部署包，前端引用改成相对路径。此时部署包从7个文件变成8个文件，新增的就是这个本地化的Plotly。重新打包、覆盖、重启，再访问就正常了。

这个坑提醒我：内网部署，所有外部依赖都必须本地化，不能有任何外网CDN引用。 flv.js当时已经本地化了，但Plotly漏掉了，结果就栽了。

四、顺手调了视频比例和工时描述

视频流正常播放后，用户又提了个小需求：视频区域比例不对。我把.video-container的CSS从aspect-ratio: 4 / 3改成aspect-ratio: 16 / 9，覆盖服务器上的同名HTML就生效了。

接着是固定出勤时间的问题。后端factory_api_server.py第56行附近有一个FIXED_WORKTIME字典，定义了每个工位的固定出勤时间（单位秒）：

FIXED_WORKTIME = {
    'SCBX':   2*8*3600,   # 57,600 — 上层布线，2人×8h
    'SCZZ':   1*8*3600,   # 28,800
    'DCZZBX': 1*8*3600,   # 28,800
    'GJQ':    1*8*3600,   # 28,800 — 工具区，1人×8h
    'ZCZZ':   1*8*3600,   # 28,800
}

用户问如果要改某个工位的固定时间去哪里改。答案就在这个字典，比如工具区改成2人×8h就写2*8*3600，改成1人×10h就写1*10*3600，改完重启factory_api_server.py即可。

但在沟通中我还发现一个描述不一致的地方：分析页顶部的说明卡片里，前端HTML第658行写着“出勤时间 = 工位固定出勤时间。SCBX 上层布线：2人 × 16小时/天；其余 4 工位：1人 × 8小时/天。”而后端配置里SCBX明明是2*8*3600，也就是2人×8h，前端却写成了16小时/天。这个矛盾得改，我当时问用户要不要顺手把16h改成8h，但到这为止还没得到确认，只能先记着。

五、复盘：内网部署的检查清单

回看这一天，核心判断就一句话：内网部署时，前端的所有地址必须写服务器内网IP，所有静态资源必须本地化。 两个坑都踩在这个原则上。

最终部署包一共8个文件，关键变化：

factory_api_server.py：数据库指向10.103.50.147，后端逻辑不变
factory_dashboard_dark.html：API地址改为http://10.103.54.6:8765，视频流地址、Plotly引用、flv引用全部本地或内网
flv.min.js：本地视频播放库
plotly-2.24.1.min.js：本地图表库（3.5MB）
aaa.png、requirements.txt、start_dashboard.bat、README.md