fix: proxy preview channels through backend to avoid CORS

internal/web/ui.go

@@ -662,6 +662,7 @@ func (u *UI) Routes() (chi.Router, error) {
 	r.Get("/diagnostics", u.pageDiagnostics)
 	r.Get("/alarms", u.pageAlarms)
 	r.Get("/monitor", u.pageMonitor)
+	r.Get("/api/monitor/channels", u.apiMonitorChannels)
 	r.Get("/recognition", u.pageRecognition)
 	r.Get("/logs", u.pageLogs)
 
@@ -3869,3 +3870,24 @@ func (u *UI) pageMonitor(w http.ResponseWriter, r *http.Request) {
 	u.ensureDevicesLoaded()
 	u.render(w, r, "monitor", PageData{Title: "视频监控", Devices: u.registry.GetDevices()})
 }
+
+func (u *UI) apiMonitorChannels(w http.ResponseWriter, r *http.Request) {
+	deviceID := r.URL.Query().Get("device_id")
+	if deviceID == "" {
+		http.Error(w, "missing device_id", http.StatusBadRequest)
+		return
+	}
+	dev, ok := u.findDevice(deviceID)
+	if !ok {
+		http.Error(w, "device not found", http.StatusNotFound)
+		return
+	}
+	body, code, err := u.agent.Do("GET", dev.IP, dev.AgentPort, "/v1/preview/channels", nil)
+	if err != nil {
+		http.Error(w, err.Error(), http.StatusBadGateway)
+		return
+	}
+	w.Header().Set("Content-Type", "application/json")
+	w.WriteHeader(code)
+	w.Write(body)
+}

internal/web/ui/templates/monitor.html

@@ -19,10 +19,9 @@
 (function() {
   var grid = document.getElementById("channels-grid");
 
-  function loadChannels(deviceId, deviceIP, agentPort) {
+  function loadChannels(deviceId) {
-    var url = "http://" + deviceIP + ":" + agentPort + "/v1/preview/channels";
     grid.innerHTML = '<div class="card muted" style="grid-column:1/-1;text-align:center">加载通道中…</div>';
-    fetch("http://" + deviceIP + ":" + agentPort + "/v1/preview/channels")
+    fetch('/ui/api/monitor/channels?device_id=' + encodeURIComponent(deviceId))
       .then(function(r) { return r.json(); })
       .then(function(data) {
         var chs = data.channels || [];
@@ -58,7 +57,7 @@
     var html = '<table><thead><tr><th>设备</th><th>地址</th><th>操作</th></tr></thead><tbody>';
     {{range .Devices}}
     {{if .Online}}
-    html += '<tr><td>{{.DisplayName}}</td><td class="mono">{{.IP}}:{{.AgentPort}}</td><td><button class="btn ghost" onclick="loadChannels(\'{{.DeviceID}}\',\'{{.IP}}\',{{.AgentPort}})">加载</button></td></tr>';
+    html += '<tr><td>{{.DisplayName}}</td><td class="mono">{{.IP}}:{{.AgentPort}}</td><td><button class="btn ghost" onclick="loadChannels(\'{{.DeviceID}}\')">加载</button></td></tr>';
     {{end}}
     {{end}}
     html += '</tbody></table>';