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 次将被执行。
谢谢
如果您在使用外部库时没有任何问题,您可以使用es6-promise-pool来管理并发请求,如下所示
\nimport\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
归档时间: |
|
查看次数: |
580 次 |
最近记录: |