window对象是否有标识网络请求状态的属性或事件？

原生的window或document对象没有直接提供标识网络请求是否正在进行的属性，也没有预设的networkCallOpen、allNetworkCallsClosed这类事件。

你遇到的多请求时指示器提前隐藏的问题，可以通过以下方案解决：

方案一：手动维护请求计数器 #

自己维护一个全局请求计数变量，发起请求时递增计数，请求完成（无论成功或失败）时递减，根据计数判断是否隐藏指示器：

// 全局维护请求计数
let activeRequestCount = 0;

async function fetchWithIndicator(url) {
  activeRequestCount++;
  // 首次发起请求时显示指示器
  if (activeRequestCount === 1) {
    showNetworkIcon();
  }

  try {
    const response = await fetch(url);
    return await response.json();
  } finally {
    activeRequestCount--;
    // 所有请求完成后才隐藏指示器
    if (activeRequestCount === 0) {
      showNetworkIcon(false);
    }
  }
}

// 替换原有fetch调用即可
// const data = await fetchWithIndicator(url);

方案二：重写全局fetch方法（自动管理） #

如果不想逐个修改请求调用，可以重写全局fetch，自动处理计数器逻辑：

let activeRequestCount = 0;
const originalFetch = window.fetch;

window.fetch = async function(...args) {
  activeRequestCount++;
  if (activeRequestCount === 1) {
    showNetworkIcon();
  }

  try {
    return await originalFetch.apply(this, args);
  } finally {
    activeRequestCount--;
    if (activeRequestCount === 0) {
      showNetworkIcon(false);
    }
  }
};

// 原有fetch代码无需手动调用显示/隐藏方法
// const response = await fetch(url);
// const data = await response.json();

注意：如果页面中还存在XMLHttpRequest发起的请求，需要同样封装XMLHttpRequest的open及load/error/abort事件，才能完整统计所有请求。

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