javascript - 使用 fetch 和 chrome 的多个请求一次只能处理 6 个文件，其他请求将被停止

Question

我向服务器发出 10 个请求，每 5 秒获取并重新加载一次。 1 分钟后浏览器卡住。
Chrome 只能同时处理 6 个请求，并暂停所有其他请求。
一切都被卡住(滚动页面，放大 map )直到请求完成。
有没有办法让 Chrome 同时处理所有请求？

我有什么地方做错了吗？

我尝试使用异步获取和 Xhr 请求，但到处都是相同的结果。

const headers = new Headers();
headers.set('Content-Type', 'application/json');

let _options = {
  credentials: 'include',
  cache: 'no-cache',
  mode: 'cors',
  redirect: 'follow',
  referrer: 'no-referrer',
  headers
};


fetch(url, _options).then(
  response => {
    if (response.status !== 200) {
      console.log(`Looks like there was a problem. Status Code: ${
        response.status}`);
      return;
    }

    // Examine the text in the response
    response.json().then(data => data);
  }
)
  .catch(err => {
    console.log('Fetch Error :-S', err);
  });

enter image description here

Answer 1

尝试减少请求

我假设您可以控制服务器端代码，并且所有请求都发送到同一服务器。在这种情况下，有什么要求？

您每 5 秒发出的这 10 个请求，它们是否从同一源获取不同的数据位？例如...是一个请求获取最新评论，另一个请求获取最新注册用户名，另一个请求获取前十名，等等？如果是这种情况，则在一个请求中在服务器端执行所有 10 个操作，并将它们一次性全部返回给客户端。处理单个请求可能需要更长的时间，但您可以大大减少客户端的带宽和负载。

或者，或者另外，解决您一遍又一遍地提出相同请求的事实。如果您每 5 秒请求一次相同的数据，并且您只对这些数据何时发生变化感兴趣，请尝试使用 websockets。不要每 5 秒重复一次请求，而是打开一个 Websocket 连接，让服务器每 5 秒或每当服务器知道数据已更改时向您发送该数据。