当前位置：首页 > JavaScript

js 轮询实现

2026-02-02 08:19:25JavaScript

轮询的基本概念

轮询（Polling）是一种客户端定期向服务器发送请求以检查数据更新的技术。适用于需要实时性但无需高频率的场景，如聊天应用、状态监控等。

简单轮询实现

使用 setInterval 定时发送请求：

function pollServer() {
  fetch('https://api.example.com/data')
    .then(response => response.json())
    .then(data => {
      console.log('Updated data:', data);
    })
    .catch(error => {
      console.error('Polling error:', error);
    });
}

// 每5秒轮询一次
const pollingInterval = setInterval(pollServer, 5000);

// 停止轮询
// clearInterval(pollingInterval);

优化：基于条件的轮询

在响应中判断是否需要继续轮询（如根据数据状态或服务器指令）：

let shouldPoll = true;

function conditionalPoll() {
  if (!shouldPoll) return;

  fetch('https://api.example.com/data')
    .then(response => response.json())
    .then(data => {
      if (data.needsUpdate) {
        console.log('Data updated:', data);
      }
      setTimeout(conditionalPoll, 3000); // 延迟3秒后继续
    })
    .catch(() => {
      setTimeout(conditionalPoll, 10000); // 错误时延长间隔
    });
}

conditionalPoll(); // 启动

指数退避策略

处理失败时逐步增加轮询间隔，避免频繁重试：

let retryDelay = 1000;
const maxDelay = 60000;

function exponentialBackoffPoll() {
  fetch('https://api.example.com/data')
    .then(response => {
      retryDelay = 1000; // 成功时重置延迟
      return response.json();
    })
    .then(data => {
      console.log('Data:', data);
      setTimeout(exponentialBackoffPoll, 3000); // 正常轮询间隔
    })
    .catch(() => {
      setTimeout(exponentialBackoffPoll, retryDelay);
      retryDelay = Math.min(retryDelay * 2, maxDelay); // 延迟加倍
    });
}

exponentialBackoffPoll();