直接用 fetch 调 REST API 最轻量可控，但必须处理跨域、错误响应结构、轮询节奏三件事：需配置 CORS 或代理解决跨域；须按各接口规范校验 code、构造 FormData、带认证头；轮询间隔应依设备限制设定（如 KND ≥2000ms）；数据需统一字段名、单位和时间戳格式。
直接用 fetch 调 REST API 是最轻量、最可控的方式，不需要额外框架或 SDK，但必须处理好跨域、错误响应结构、轮询节奏这三件事。
为什么不能直接写 fetch('/api/status') 就完事？
浏览器会拦截多数跨域请求——尤其是当你的仪表盘 HTML 文件是本地双击打开（file:// 协议），或部署在 http://localhost:3000，而 API 在 http://192.168.1.100:80（如 KND 数控系统）时。此时会报 CORS error 或 net::ERR_CONNECTION_REFUSED。
解决路径只有两条：
- 让后端 API 响应头带上
Access-Control-Allow-Origin: *（适合你有权限改服务端，比如自建的 Tianshu 或 APITable） - 前端不直连，加一层代理：用
nginx或webpack-dev-server把/api请求反向代理到目标地址（适合对接工业设备、老系统等无法改 CORS 的场景）
fetch 调 KND / ETS2 / Tianshu 这类 REST API 的通用写法
它们返回的都是 JSON，但错误处理逻辑差异极大：
立即学习“前端免费学习笔记（深入）”；
Figma REST API 资产导出器
下载
使用 GET /v1/files/:key 和 /v1/images/:key 端点从 Figma 文件中导出设计资源。支持 SVG、PNG 和 PDF 导出，并可设置缩放和格式参数。
- KND 的
/api/v1/status接口，即使 HTTP 状态码是 200，body 里也可能含{"code": -1, "msg": "Not ready"}—— 必须检查response.code !== 0才算真正成功 - Tianshu 的
/api/v1/tasks/submit是multipart/form-data，不能用JSON.stringify，得用FormData构造体；且必须带X-API-Key头，漏掉就直接 401 - ETS2 Telemetry Server 的 WebSocket 地址是
ws://localhost:8080，但它的 REST/api/telemetry是只读快照，适合做初始化加载，不适合高频轮询（它每秒只更新一次）
一个最小可用的 KND 状态拉取示例：
async function fetchKndStatus() {
try {
const res = await fetch('http://192.168.1.100/api/v1/status');
const data = await res.json();
if (data.code !== 0) {
console.error('KND API error:', data.msg);
return null;
}
return data;
} catch (e) {
console.error('Network failed:', e.message);
return null;
}
}
轮询频率怎么设才不崩掉设备或被限流？
不是越快越好。工业设备（如 KND）、游戏遥测（ETS2）、AI 平台（Tianshu）对并发和频次都有隐性限制：
- KND v1.3 文档明确建议「避免高频轮询」，实测
setInterval(fetchKndStatus, 2000)是安全下限；低于 1000ms 容易触发内部节流，返回空数据 - ETS2 Telemetry Server 的 REST 接口本质是内存快照拷贝，每 1000ms 刷新一次，设成 500ms 轮询只是白占连接，还可能被服务器主动断开
- Tianshu 的任务查询接口
/api/v1/tasks/{id}建议按状态切换调整轮询间隔：提交后前 5 秒每 500ms 查一次，进入 processing 后降为 2s，完成后再停掉
图表渲染前，数据格式要先“对齐”
Chart.js、Highcharts 这些库只认特定结构的数据，但不同 API 返回的字段名五花八门：
- KND 的主轴转速字段是
spindle_speed，而 ETS2 的发动机转速是engineRpm，Tianshu 的处理进度是progress - 如果你把它们都喂给同一个
line chart，必须统一映射：{ x: Date.now(), y: data.spindle_speed || data.engineRpm || data.progress } - 更关键的是单位：KND 返回转速是整数（rpm），ETS2 是浮点（rpm × 100），直接画图会导致刻度错乱——务必在赋值前做归一化
容易被忽略的一点：所有时间戳字段（比如 last_update）几乎都不带时区信息，前端用 new Date().getTime() 对齐时，要确认后端是否已转为 Unix timestamp（秒 or 毫秒），否则图表横轴会偏移 8 小时。
