使用jQuery定时检测API返回数据变化时的长度匹配异常问题

嘿，我之前做实时数据监控的时候也碰到过类似的诡异情况，咱们一步步拆解可能的问题：

1. 先排查API请求本身是否正常 #

大概率是某次轮询的API请求出了问题，导致返回空数据：

• 给你的请求代码加个详细日志，打印每次请求的状态码和原始响应内容，比如：

  fetch('你的API地址')
    .then(res => {
      console.log(`请求状态码: ${res.status}`);
      return res.text(); // 先返回文本，看看原始内容
    })
    .then(rawText => {
      console.log('原始响应:', rawText);
      try {
        const newData = JSON.parse(rawText);
        // 后续处理逻辑
      } catch (e) {
        console.error('JSON解析失败:', e);
      }
    })
  

  这样就能知道是不是服务端返回了空字符串、错误页面，或者干脆请求失败了（比如429限流、500错误）。
• 有些API会对频繁请求做限制，比如同一IP短时间内请求过多就返回空数据，你可以检查请求头里的User-Agent、认证token是不是每次都正确携带，有没有过期。

2. 检查数据处理与变量更新逻辑 #

有可能是代码里不小心清空了newData：

• 看看你处理响应的代码，是不是在解析出错时把newData设成了空数组？比如：

  let newData = [];
  try {
    newData = JSON.parse(rawResponse);
  } catch (e) {
    // 这里如果没处理，newData就还是初始的空数组
  }
  

• 另外，确认oldData的更新时机是不是正确——只有当newData是有效数据时才更新，别在异常情况下把空数组赋值给oldData。

3. 别用setInterval，改用递归式定时器 #

setInterval是不管上一次请求有没有完成，到点就触发新请求，很容易导致数据混乱：
比如上一次请求还在pending，新的请求已经发起，可能某次响应延迟，导致newData被覆盖成空。换成请求完成后再延迟1秒发起下一次的方式，像这样：

let oldData = [];

function pollData() {
  fetch('你的API地址')
    .then(res => {
      if (!res.ok) throw new Error(`请求失败: ${res.status}`);
      return res.json();
    })
    .then(newData => {
      // 对比逻辑
      if (newData.length === oldData.length) {
        console.log('old old old...');
      } else {
        console.log('new new new...');
        updateChart(newData);
        oldData = [...newData]; // 浅拷贝，避免引用问题
      }
      // 请求成功后，1秒后再轮询
      setTimeout(pollData, 1000);
    })
    .catch(err => {
      console.error('轮询出错:', err);
      // 出错也重试，避免中断
      setTimeout(pollData, 1000);
    });
}

// 启动第一轮轮询
pollData();

最后说个小细节 #

如果API返回的是数组，还要确认是不是服务端有时候会返回null而不是空数组，你的代码有没有处理这种情况？比如把null转换成空数组，导致长度为0。

先按上面的步骤加日志排查，应该很快就能找到问题所在！

内容的提问来源于stack exchange，提问作者Ilaroz