负载均衡重构: 子网感知选择 + 节点健康监控 + 节点注册上报API

- 新增 subnet-aware 负载策略: 根据客户端IP匹配最近/16子网节点
- 节点注册端点 (POST /api/nodes/register): 边缘节点自动注册
- 节点心跳端点 (POST /api/nodes/heartbeat): 上报CPU/RAM/带宽/连接数
- 健康汇总 (GET /api/nodes/health): 服务端汇总所有节点状态
- 配置节点新增subnet/is_origin字段
- 前端NodeManager: 实时健康状态/CPU/RAM进度条/带宽/连接数
- X-Forwarded-For/X-Real-IP透传支持客户端IP

frontend/src/admin/pages/NodeManager.tsx

@@ -1,12 +1,20 @@
 import { useState, useEffect } from 'react'
 import {
-  Card, Table, InputNumber, Switch, Typography, message, Space, Tag, Statistic, Row, Col, Button,
+  Card, Table, InputNumber, Switch, Typography, message, Space, Tag, Statistic, Row, Col, Button, Tooltip, Progress,
 } from 'antd'
-import { CheckCircleOutlined, CloseCircleOutlined, ReloadOutlined } from '@ant-design/icons'
+import { CheckCircleOutlined, CloseCircleOutlined, ReloadOutlined, DashboardOutlined } from '@ant-design/icons'
 import api from '../../api/client'
 
 const { Title, Text } = Typography
 
+interface NodeMetrics {
+  cpu_percent: number | null
+  memory_percent: number | null
+  bandwidth_mbps: number | null
+  active_connections: number | null
+  hls_readers: number | null
+}
+
 interface NodeInfo {
   id: string
   name: string
@@ -15,6 +23,10 @@ interface NodeInfo {
   api_port: number
   weight: number
   enabled: boolean
+  subnet: string
+  is_origin: boolean
+  online: boolean
+  metrics: NodeMetrics | null
 }
 
 interface StrategyInfo {
@@ -24,6 +36,7 @@ interface StrategyInfo {
 }
 
 const strategyLabels: Record<string, string> = {
+  'subnet': 'Subnet-Aware',
   'round-robin': 'Round-Robin',
   'weighted': 'Weighted',
   'least-conn': 'Least-Conn',
@@ -34,7 +47,7 @@ export default function NodeManager() {
   const [strategy, setStrategy] = useState<StrategyInfo | null>(null)
   const [loading, setLoading] = useState(true)
 
-  useEffect(() => { loadData() }, [])
+  useEffect(() => { loadData(); const t = setInterval(loadData, 10000); return () => clearInterval(t) }, [])
 
   async function loadData() {
     setLoading(true)
@@ -66,42 +79,72 @@ export default function NodeManager() {
     } catch { message.error('Failed') }
   }
 
+  const onlineNodes = nodes.filter((n) => n.online).length
+
   const columns = [
+    {
+      title: 'Status', dataIndex: 'online', key: 'online', width: 80,
+      render: (online: boolean) => (
+        <Tooltip title={online ? 'Online' : 'Offline'}>
+          <Tag icon={online ? <CheckCircleOutlined /> : <CloseCircleOutlined />}
+            color={online ? 'success' : 'error'} />
+        </Tooltip>
+      ),
+    },
     { title: 'Name', dataIndex: 'name', key: 'name' },
-    { title: 'Host', dataIndex: 'host', key: 'host' },
-    { title: 'HLS Port', dataIndex: 'hls_port', key: 'hls_port', width: 100 },
-    { title: 'API Port', dataIndex: 'api_port', key: 'api_port', width: 100 },
+    { title: 'Host', dataIndex: 'host', key: 'host', width: 140 },
+    {
+      title: 'Subnet', dataIndex: 'subnet', key: 'subnet', width: 140,
+      render: (v: string) => <Text code style={{ fontSize: 12 }}>{v}</Text>,
+    },
+    {
+      title: 'CPU', key: 'cpu', width: 80,
+      render: (_: any, r: NodeInfo) => r.metrics?.cpu_percent != null
+        ? <Progress size="small" percent={Math.round(r.metrics.cpu_percent)} strokeColor="#1E3A5F" showInfo={false} />
+        : <Text type="secondary">--</Text>,
+    },
+    {
+      title: 'RAM', key: 'ram', width: 80,
+      render: (_: any, r: NodeInfo) => r.metrics?.memory_percent != null
+        ? <Progress size="small" percent={Math.round(r.metrics.memory_percent)} strokeColor="#1E3A5F" showInfo={false} />
+        : <Text type="secondary">--</Text>,
+    },
+    {
+      title: 'BW', key: 'bw', width: 70,
+      render: (_: any, r: NodeInfo) => r.metrics?.bandwidth_mbps != null
+        ? <Text style={{ fontSize: 12 }}>{r.metrics.bandwidth_mbps.toFixed(1)} Mbps</Text>
+        : <Text type="secondary">--</Text>,
+    },
+    {
+      title: 'Conn', dataIndex: 'connections', key: 'conn', width: 60,
+      render: (_: any, r: NodeInfo) => r.metrics?.active_connections != null
+        ? r.metrics.active_connections
+        : <Text type="secondary">--</Text>,
+    },
     {
       title: 'Weight', dataIndex: 'weight', key: 'weight', width: 140,
       render: (_: number, record: NodeInfo) => (
         <InputNumber
-          min={0}
-          max={1000}
-          value={record.weight}
+          min={0} max={1000} value={record.weight}
           onChange={(val) => {
             const v = val || 0
             setNodes((prev) => prev.map((n) => (n.id === record.id ? { ...n, weight: v } : n)))
             updateWeight(record.id, v)
           }}
-          size="small"
-          style={{ width: 90 }}
+          size="small" style={{ width: 80 }}
+          disabled={record.is_origin}
         />
       ),
     },
     {
-      title: 'Enabled', dataIndex: 'enabled', key: 'enabled', width: 80,
+      title: 'Enabled', dataIndex: 'enabled', key: 'enabled', width: 70,
       render: (_: any, record: NodeInfo) => (
         <Switch
-          checked={record.enabled}
-          onChange={(val) => toggleNode(record.id, val)}
-          size="small"
+          checked={record.enabled} onChange={(val) => toggleNode(record.id, val)}
+          size="small" disabled={record.is_origin}
         />
       ),
     },
-    {
-      title: 'Health', key: 'health', width: 100,
-      render: () => <Tag icon={<CheckCircleOutlined />} color="success">Online</Tag>,
-    },
   ]
 
   return (
@@ -110,26 +153,26 @@ export default function NodeManager() {
 
       {strategy && (
         <Row gutter={[24, 24]} style={{ marginBottom: 24 }}>
-          <Col xs={24} sm={8}>
+          <Col xs={24} sm={6}>
             <Card style={{ borderRadius: 12 }}>
-              <Statistic
-                title="Strategy"
-                value={strategyLabels[strategy.strategy] || strategy.strategy}
-              />
+              <Statistic title="Strategy" value={strategyLabels[strategy.strategy] || strategy.strategy} />
             </Card>
           </Col>
-          <Col xs={24} sm={8}>
+          <Col xs={24} sm={6}>
             <Card style={{ borderRadius: 12 }}>
-              <Statistic
-                title="Multicast"
-                value={strategy.multicast_available ? 'Available' : 'N/A'}
-                valueStyle={{ color: strategy.multicast_available ? '#2E7D32' : '#999' }}
-              />
+              <Statistic title="Multicast" value={strategy.multicast_available ? 'Available' : 'N/A'}
+                valueStyle={{ color: strategy.multicast_available ? '#2E7D32' : '#999' }} />
             </Card>
           </Col>
-          <Col xs={24} sm={8}>
+          <Col xs={24} sm={6}>
             <Card style={{ borderRadius: 12 }}>
-              <Statistic title="Nodes" value={nodes.length} />
+              <Statistic title="Total Nodes" value={nodes.length} />
+            </Card>
+          </Col>
+          <Col xs={24} sm={6}>
+            <Card style={{ borderRadius: 12 }}>
+              <Statistic title="Online" value={onlineNodes}
+                valueStyle={{ color: onlineNodes > 0 ? '#2E7D32' : '#C62828' }} />
             </Card>
           </Col>
         </Row>
@@ -146,7 +189,8 @@ export default function NodeManager() {
           rowKey="id"
           loading={loading}
           pagination={false}
-          size="middle"
+          size="small"
+          scroll={{ x: 1100 }}
         />
       </Card>
     </div>

frontend/src/admin/pages/Settings.tsx

@@ -7,8 +7,9 @@ import api from '../../api/client'
 const { Title } = Typography
 
 const strategies = [
-  { value: 'round-robin', label: 'Round-Robin' },
+  { value: 'subnet', label: 'Subnet-Aware (Recommended)' },
   { value: 'weighted', label: 'Weighted' },
+  { value: 'round-robin', label: 'Round-Robin' },
   { value: 'least-conn', label: 'Least Connections' },
 ]