如何使用 Promise.all 处理数千个请求

ang*_*gus 5 javascript promise reactjs axios

在我的 React 应用程序中,我有一个组件将请求发送到一个在线服务,该服务最多可以处理 50 个请求。我现在收到一个执行 7000 个 MAC 的新请求。

function App() {
const [data, setData] = useState([]);

useEffect(() => {
     const fetchData = async () => {
        await axios.all([
             axios.get("/ipdn/<MAC ADDRESS>", { timeout: 10000 }),
             axios.get("/ipdn/<MAC ADDRESS>", { timeout: 10000 })
       // Adding all the mac address ....... 
        ]).then((responseArr) => {
            setData(responseArr)
        });
     };
    fetchData();
}, []);
Run Code Online (Sandbox Code Playgroud)

我想扩展 fetchData 函数,所以基本上它只会发送 50 个 IP 并等待迭代完成。

当迭代完成后,接下来的 50 次将被执行。

谢谢

Pra*_*ddy 1

如果您在使用外部库时没有任何问题,您可以使用es6-promise-pool来管理并发请求,如下所示

\n
import\xc2\xa0PromisePool\xc2\xa0from \'es6-promise-pool\';\n\n\n// macs - Array of mac addresses\nuseEffect(() => {\n  const fetchData = () => {\n    const results = [];\n    const\xc2\xa0generatePromises\xc2\xa0=\xc2\xa0function*()\xc2\xa0{\n\xc2\xa0\xc2\xa0    for\xc2\xa0(let\xc2\xa0count\xc2\xa0=\xc2\xa00;\xc2\xa0count\xc2\xa0<\xc2\xa0macs.length;\xc2\xa0count++)\xc2\xa0{\n\xc2\xa0\xc2\xa0\xc2\xa0\xc2\xa0    yield\xc2\xa0axios.get(`/ipdn/${macs[count]}`, ...);\n\xc2\xa0\xc2\xa0    }\n    }\n    const\xc2\xa0promiseIterator =\xc2\xa0generatePromises();\n    //\xc2\xa0Create\xc2\xa0a\xc2\xa0pool with 10 concurrent requests max\n    const\xc2\xa0pool\xc2\xa0=\xc2\xa0new\xc2\xa0PromisePool(\n      promiseIterator,\n      10 // Configurable\n    );\n    // To listen to result\n    pool.addEventListener(\'fulfilled\', function (event) {\n      console.log(\'Fulfilled: \' + event.data.result);\n      results.push(event.data.result);\n    });\n    //\xc2\xa0Start\xc2\xa0the\xc2\xa0pool\n    pool.start().then(function\xc2\xa0()\xc2\xa0{\n      setData(results);\n\xc2\xa0\xc2\xa0\xc2\xa0\xc2\xa0  console.log(\'Complete\');\n\xc2\xa0\xc2\xa0  });\n  };\n  fetchData();\n}, []);\n
Run Code Online (Sandbox Code Playgroud)\n