JS 每隔一段时间发送请求,并根据响应结果动态调整请求间隔

const FIRST_INTERVAL = 1000; // 初始请求间隔(毫秒)
const INCREASE_INTERVAL = 5000; // 响应结果不变时,递增的请求间隔(毫秒)

let timer = null;
let interval = FIRST_INTERVAL;
let lastResponse;

function startFetch() {
  fetchData(); // 首次立即发起请求
}

function fetchData() {
  fetch(url)
    .then(response => response.json())
    .then(data => {
      if (JSON.stringify(data) === JSON.stringify(lastResponse)) { // 判断响应结果是否未变
        interval += INCREASE_INTERVAL; // 请求间隔递增
      } else {
        interval = FIRST_INTERVAL; // 重置请求间隔
        lastResponse = data; // 更新最新响应结果
      }
      timer = setTimeout(fetchData, interval); // 设置下一次请求
    })
    .catch(error => console.error(error));
}

function stopFetch() {
  clearTimeout(timer);
}

首先,我们定义了两个常量 FIRST_INTERVAL 和 INCREASE_INTERVAL 分别表示初始请求间隔和响应结果不变时递增的请求间隔。然后定义了三个变量 timer,interval 和 lastResponse,其中 timer 表示定时器返回值,interval 表示当前请求间隔,lastResponse 表示最新的响应结果。

接着定义了 startFetch() 函数,该函数会立即执行一次 fetchData() 函数发起第一次请求;定义 fetchData() 函数,该函数使用 fetch() 方法发起 AJAX 请求,并在请求成功后处理响应数据。如果本次响应结果与上一次响应结果相同,则将请求间隔递增 INCREASE_INTERVAL 毫秒;否则,重置请求间隔为 FIRST_INTERVAL,同时更新 lastResponse 为新的响应结果。最后,用 setTimeout() 方法设置下一次请求时间,并返回定时器对象 timer。

最后定义了 stopFetch() 函数,用于停止定时器的执行。

在与 API 调用相关的代码中,我们常常会遇到需要周期性地让浏览器发起请求的需求。该示例实现了根据响应结果动态调整的请求间隔。当响应结果不变时,递增请求间隔可以节省不必要的网络流量。

完了,已经面向gpt编程了┌(。Д。)┐

_(:з」∠)_

_(:з」∠)_

_(:з」∠)_

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值