时间:2021-05-26
请实现如下的函数(发请求的函数可以直接使用fetch)
fetch 函数返回的是一个promise,promise对象在实例化的时候就已经开始执行了。
简易实现
function fetch(url) { // 模拟接口请求 return new Promise(resolve => { setTimeout(() => { resolve(url) }, 10000*Math.random()) })}/** * 接口请求最大并发量控制 * @param { Array } urls 接口请求地址数组集合 * @param { Number } max 最大并发量 * @param { Function } callback 回调函数 */function maxRequestLimit(urls, max, callback) { // 如果没有传入urls或max则不继续执行 if (!urls || !max) return // 当请求地址数组集合长度为0,则执行回调函数(如果有的话),并结束后续执行 if(urls.length === 0) { if(callback) callback() return } // 使用splice方法返回当前要使用的请求集合,同时删除原有的请求集合 const onceMaxUrlArr = urls.splice(0, max) // 进行map转换,将url参数转换为promise const onceMaxFetchArr = onceMaxUrlArr.map(url => fetch(url)) // 使用当前这一队列 Promise.all(onceMaxFetchArr) .then(res => { console.log(res) // 递归请求 maxRequestLimit(urls, max, callback) })}maxRequestLimit(['url1', 'url2', 'url3', 'url4', 'url5', 'url6', 'url7', 'url8'], 3, () => {console.log('fetch end')})上面的简易实现是一个队列一个队列进行请求,实际运行效果会存在一定的阻塞,下面通过进一步改善来提高请求的效率
完善实现
function fetch(url) { // 模拟接口请求 return new Promise(resolve => { setTimeout(() => { resolve(url) }, 10000 * Math.random()) })}/** * 接口请求最大并发量控制 * @param { Array } urls 接口请求地址数组集合 * @param { Number } max 最大并发量 * @param { Function } callback 回调函数 */function maxRequestLimit(arr, max, callback) { // 如果没有传入urls或max则不继续执行 if (!arr || !max) return // 当请求地址数组集合长度为0,则执行回调函数(如果有的话),并结束后续执行 if(arr.length === 0) { if(callback) callback() return } let fetchArr = [], // 存储并发max的promise数组 i = 0; function toFetch() { // 所有的请求都受理,则返回一个resolve if (i === arr.length) return Promise.resolve() // 取出第i个url, 放入fetch里面 , 每取一次i++ let one = fetch(arr[i++]) //将当前的promise存入并发数组中 fetchArr.push(one) // 当promise执行完毕后,从数组删除 one.then(res => { console.log(res) fetchArr.splice(fetchArr.indexOf(one), 1) }) let p = Promise.resolve() // 当并行数量达到最大后, 用race比较 第一个完成的, 然后再调用一下函数自身。 if (fetchArr.length >= max) p = Promise.race(fetchArr) return p.then(() => toFetch()) } // arr循环完后, 现在fetchArr里面剩下的promise对象, 使用all等待所有的都完成之后执行callback toFetch() .then(() => Promise.all(fetchArr)) .then(() => callback())}maxRequestLimit(['url1', 'url2', 'url3', 'url4', 'url5', 'url6', 'url7', 'url8'], 3, () => { console.log('fetch end') })总结
到此这篇关于js异步接口并发数量控制的文章就介绍到这了,更多相关js异步接口并发数量控制内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
背景日常开发中,难免遇到并发场景,而并发场景难免需要做流量控制,即需要对并发的进程或者线程的总量进行控制。今天简单总结两种常用的控制线程个数的方法。方法一:进程
整理文档,搜刮出一个Yii2.0中使用js异步删除示例,稍微整理精简一下做下分享。控制器:publicfunctionactionWeixinnotificat
本文实例为大家分享了JS实现音量控制拖动的具体代码,供大家参考,具体内容如下描述:JS——实现音量控制拖动1)、有底条,有拖拽按钮2)、设置最小和最大值3)、拖
第二个关键点:推荐宝贝数量控制一般而言,数量控制在6-9款比较合适,多了会引起买家反感,过犹不及。对于女装类店铺而言,还有被降权的风险,如果在描述上方推荐过多的
本文章来给各位同学总结一下APACHE中限制IP连接数与IP并发数和流量控制实现方法,如果只限制连接数据我们可以直接使用limit,如果要限制其它的需要使用其它