Promise.all中对于reject的处理方法

昨天写了个小爬虫，用axios.all同时请求多个页面时，国内网络的原因很容易就超时然后reject了，佛系resolve不可取啊，然后想到可以实现一个“重发失败请求”的功能。

Promise.all(requestPromises).then(...).catch(...) 会在所有requestPromises都resolve时才会进then方法，并且把所有结果以一个数组返回。只要有一个失败，就会进catch。如果在单个请求中定义了catch方法，那么就不会进Promise.all的catch方法。因此，可以在单个的catch中将失败的promise放入一个list，待一轮请求完成后，再去请求失败的请求。

let failedList = []
function getDataById (id) { // 这是单个请求
 return new Promise(function (resolve, reject) {
  getResponse(id, resolve, reject)
 }).catch(e => {
  failedList.push(arguments.callee(id)) // 如果失败，就重新发起请求，并将该请求的promise放入failedList中以便后续处理
 })
}
function getResponse (id, resolve, reject) { // 模拟返回结果
 setTimeout(() => {
  if (Math.random() > 0.8) resolve({id, msg: 'ok'})
  else reject({id, msg: 'error'})
 }, 1000)
}
const RequestList = [getDataById(1), getDataById(2), getDataById(3)]
fetchData(RequestList)
let counter = 1 // 请求次数
let maxRequestTimes = 5 // 最大请求次数，因为有可能别个页面就是访问不了，请求多少次也没用- -
let result = [] // 最后的结果
function fetchData (requestList) { // 这里是对请求结果的处理
 Promise.all(requestList).then(resolve => {
  result = result.concat(resolve.filter(i => i)) // filter返回true的时候保留该数组项，因为getDataById的catch里没有给返回值（这里也不需要），这里的resolve里就会有undefined，需要过滤掉
  let failedLength = failedList.length
  if (failedLength > 0 && counter < maxRequestTimes) { // 如果失败列表里有请求，并且请求次数不超过设定的值，就进行下一次请求，并且打出log
   console.log(`第${counter}次请求完成，其中成功${RequestList.length - failedLength}个，失败${failedLength}个，正在进行第${++counter}次请求...`)
   fetchData(failedList)
   failedList = [] // 这里要清空failedList，不然会一直调用。不用担心，下一次请求失败的会在getDataById填充到failedList里。
  } else { // 表示所有请求都成功了，或者达到了最大请求次数。到这里就可以对result做进一步处理了。
   console.log(`请求完成，共请求${counter}次, 其中成功${RequestList.length - failedLength}个，失败${failedLength}个\n`, result)
   counter = 1
  }
 }).catch(e => {
  console.log(e)
 })
}

总结

以上所述是小编给大家介绍的Promise.all中对于reject的处理方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • 微信小程序 ES6Promise.all批量上传文件实现代码

    微信小程序 ES6Promise.all批量上传文件实现代码 客户端 Page({ onLoad: function() { wx.chooseImage({ count: 9, success: function({ tempFilePaths }) { var promise = Promise.all(tempFilePaths.map((tempFilePath, index) => { return new Promise(function(resolve, reject) { wx.

  • 利用ES6的Promise.all实现至少请求多长时间的实例

    1.背景 我们都知道ajax请求可以加个timeout,就是最多请求多少时间,如果超过这个时间直接就报错. 这个是最多请求多长时间,我现在要做的是,最少要请求多长时间,然后才能执行后续的逻辑. 比如,一个ajax请求 x 毫秒就执行完毕了,但我要让他至少执行1秒钟,那我们会这么想: ajax完成后 , 1. 如果x<1s, 那我们先setTimeout => 1s - x ,然后执行后续操作. 2 如果x>=1s, 那我们直接执行后续操作. 想想这可繁琐了,我们还要在前面记录一下开始时间

  • Promise.all中对于reject的处理方法

    昨天写了个小爬虫,用axios.all同时请求多个页面时,国内网络的原因很容易就超时然后reject了,佛系resolve不可取啊,然后想到可以实现一个"重发失败请求"的功能. Promise.all(requestPromises).then(...).catch(...) 会在所有requestPromises都resolve时才会进then方法,并且把所有结果以一个数组返回.只要有一个失败,就会进catch.如果在单个请求中定义了catch方法,那么就不会进Promise.all

  • 在 Node.js 中使用 async 函数的方法

    借助于新版 V8 引擎,Node.js 从 7.6 开始支持 async 函数特性.今年 10 月 31 日,Node.js 8 也开始成为新的长期支持版本,因此你完全可以放心大胆地在你的代码中使用 async 函数了.在这边文章里,我会简要地介绍一下什么是 async 函数,以及它会如何改变我们编写 Node.js 应用的方式. 1 什么是 async 函数 利用 async 函数,你可以把基于 Promise 的异步代码写得就像同步代码一样.一旦你使用 async 关键字来定义了一个函数,那

  • VUE中使用HTTP库Axios方法详解

    VUE中使用HTTP库Axios方法详解

    Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中 安装Axios模块 在Vue中使用,最好安装两个模块axios 和vue-axios $npm install axios vue-axios --save 然后引用并使用模块 import Axios from 'axios' import VueAxios from 'vue-axios' Vue.use(VueAxios,Axios) 在组件中通过如下方式进行使用 this.$http[meth

  • 微信小程序中使用 async/await的方法实例分析

    本文实例讲述了微信小程序中使用 async await的方法.分享给大家供大家参考,具体如下: 微信小程序中有大量接口是异步调用,比如 wx.login().wx.request().wx.getUserInfo() 等,都是使用一个对象作为参数,并定义了 success().fail() 和 complete() 作为异步调用不同情况下的回调. 但是,以回调的方式来写程序,真的很伤,如果有一个过程需要依次干这些事情: wx.getStorage() 获取缓存数据,检查登录状态 wx.getSe

  • vue中的使用token的方法示例

    vue中的使用token的方法示例

    初始于登录页面 Home.vue <template> <div class="home"> </div> </template> <script> // @ is an alias to /src import HelloWorld from '@/components/HelloWorld.vue' import axios from 'axios'; export default { name: 'home', comp

  • Node中文件断点续传原理和方法总结

    Node中文件断点续传原理和方法总结

    目录 原理介绍 普通上传 大文件上传 断点续传 方法总结 普通文件 前端部分 大文件 实战演练 普通文件 导语:之前做过一个小项目,其中用到了文件上传,在大文件上面使用了断点续传,降低了服务器方面的压力,现在就这个开发经验做一个细致的总结. 原理介绍 这里先介绍一下文件上传的原理,帮助理清这个头绪. 普通上传 一般网站上都是普通上传的比较多,大多数都是上传一些用户的头像,用户的动态评论附带图片什么的,所以先来说一下这个的原理. 用户选择文件后,js检测文件大小是否超出限制和格式是否正确: 检查后

  • vue js中实现图片压缩封装方法

    全局main.js引入: // 引入imgUpload方法 import * as imgUpload from "./utils/imgUpload" //外部使用 Vue.prototype.$imgUpload = imgUpload 新建imgUpload.js: const dataURLtoFile = (dataurl, filename) => { // 将base64转换为file文件 let arr = dataurl.split(',') let mime

  • 详解vuex中的this.$store.dispatch方法

    vuex中的this.$store.dispatch方法 main.js new Vue({ el:'#app', router, store, render:h=>h(APP) }) store/index.js import Vue from 'vue' import Vuex from 'vuex' import app from './modules/app' import user from '.modules/user' import getters from '.getters'

  • 在ABP框架中使用BootstrapTable组件的方法

    在ABP框架中使用BootstrapTable组件的方法

    一.关于ABP ABP是"ASP.NET Boilerplate Project (ASP.NET样板项目)"的简称,它是一个成熟的开源框架,基于DDD+Repository模式,自带Zero权限和认证模块,避免了从零开始搭建框架的烦恼.关于ABP的框架优势就此打住,因为这样说下去要说三天三夜,脱离文本主题. 关于ABP的入门,博主不想说太多,园子里面tkb至简和阳光铭睿有很多入门级的文章,有兴趣的可以了解下,还是给出它的官网和开源地址. ABP官方网站:http://www.aspn

  • ionic2中使用自动生成器的方法

    ionic generator是命令行的功能,ionic2自动帮我们创建应用程序,从而节省了大量的时间,并增加我们的速度来开发一个项目的关键部分. ionic generator使我们可以自动创建以下几部份: •component •directive •page •provider 一.创建页面:ionic g page [PageName] 通过这个命令创建一个新的页面,ionic2项目中这个命令使​​用最多 我们只需要进入我们的命令行中,并运行下面的命令: ionic g page log

随机推荐