首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Promise重试,直到Typescript成功/失败

Promise重试机制概述

Promise重试机制是一种编程模式,用于在异步操作(如网络请求)失败时自动重试,直到操作成功或达到最大重试次数。这种机制在处理不稳定的网络连接或暂时性错误时非常有用。

基础概念

  • Promise:JavaScript中的一个对象,表示异步操作的最终完成(或失败)及其结果值。
  • 重试:在异步操作失败后,再次尝试执行该操作的过程。

优势

  1. 提高可靠性:通过自动重试,可以减少因暂时性错误导致的失败。
  2. 简化代码:开发者无需手动编写复杂的错误处理逻辑。
  3. 提升用户体验:减少因网络问题导致的应用无响应或错误。

类型

  1. 固定次数重试:设定一个固定的重试次数,达到次数后停止重试。
  2. 指数退避重试:每次重试的间隔时间逐渐增加,减少对服务器的压力。
  3. 自定义条件重试:根据特定的错误类型或响应内容决定是否重试。

应用场景

  • 网络请求失败时(如HTTP请求)。
  • 数据库连接失败时。
  • 第三方API调用失败时。

实现Promise重试的示例代码(TypeScript)

以下是一个简单的固定次数重试机制的实现:

代码语言:txt
复制
async function retry<T>(fn: () => Promise<T>, retries = 3, delay = 1000): Promise<T> {
    try {
        return await fn();
    } catch (error) {
        if (retries === 0) {
            throw error;
        }
        await new Promise(resolve => setTimeout(resolve, delay));
        return retry(fn, retries - 1, delay);
    }
}

// 示例使用
async function fetchData() {
    const response = await fetch('https://api.example.com/data');
    if (!response.ok) {
        throw new Error('Network response was not ok');
    }
    return response.json();
}

retry(fetchData)
    .then(data => console.log(data))
    .catch(error => console.error('Failed after retries:', error));

参考链接

常见问题及解决方法

  1. 无限重试:确保设置了最大重试次数,避免无限循环。
  2. 重试间隔过短:使用指数退避策略,逐渐增加重试间隔时间。
  3. 错误类型判断:根据不同的错误类型决定是否重试,例如网络错误可以重试,而4xx错误通常不需要重试。

通过以上方法,可以有效地实现Promise重试机制,提高应用的稳定性和可靠性。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

使用 Node.js 实现文件流转存服务

,告知发送端已经到底了 发送分片,发送成功,还有分片,继续发送,直到分片都拿完了 对于这样的逻辑,我们可以考虑使用递归来发送分片,函数的参数传入readyCache的引用。...因为如果上面的代码能连续稳定运行十几年不出bug,是建立在以下情况的:接收端超稳定,无论多少分片,多大速率,返回一律成功 但是现实是残酷的,当数量和频率增加的时候,总会有分片上传失败,从而导致正在文件都上传失败...不过在每次catch的时候,再递归函数,之前错误的Promise就能够被递归创建的新的Promise处理,直到这个Promise能够成功返回。我们只需简单控制max的值,就能控制处理错误的次数。...所以我们也可以使用这样的逻辑来进行分片的发送,当请求出现错误的时候,在catch函数内判断重试次数,次数若大于0,则再返回一个递归的send函数,直到次数等于0,直接用Promise.reject将异常抛出...,当前分片会自动进行重试上传,直到超出重试次数,再直接抛出异常。

3.3K10

Axios 功能扩展之 axios-retry 源码阅读笔记

前两天分析了 Axios 的源码设计,其中的拦截器(interceptor)为扩展 Axios 留下了入口,在工作中我们也时常会扩展 Axios,例如:取消重复请求、权限验证、失败重试等。...typings:TypeScript 类型定义文件,用于在 TypeScript 编码环境下智能类型提示,该字段亦可写作 types。...关于退出 Promise 执行链,提供几个参考的讨论: 从如何停掉 Promise 链说起[3] Promise 的链式调用与中止[4] 2.4 响应拦截器设计&实现 在拦截器中,只响应 reject...currentState.retryCount += 1; const delay = retryDelay(currentState.retryCount, error); // Axios 合并默认配置失败...}); 总结 这是针对 axios 源码分析文章的一个补充,作为常见对于 axios 的功能扩展,失败重试 axios-retry 算是一个比较好的例子,可以作为之后扩展 axios 功能的一个模板。

1.4K20
  • 最完备的懒加载错误兜底方案,再也不会白屏了!

    /path/to/component') 动态导入会返回一个 promise 对象,并且导入成功时这个 promise 需要 resolve 一个具有默认导出(default exprot)的模块,但是...异常处理 这一层需要做的事有: 成功时需要返回一个具有默认导出的模块 失败时捕获错误并上报日志 function componentLoader(componentImport) { return.../OurComponent')); 如果是 CDN 故障,我们需要能换 CDN 重试 webpack 懒加载的原理,是在需要时,向 dom 插入一个 script 标签,在 script 加载成功时(...onload)调用动态导入 promise 的 resolve,并带上加载的资源,在失败时(onerror)调用 reject。...所以在 scriptA 加载失败时,「要让原本的 onerror 不执行」,避免让 promise 改态(因为 promise 是不可逆的),「将本来该执行的 onerror 赋给 scriptB」。

    1.3K20

    性能优化竟白屏,难道真是我的锅?

    ,当组件按需加载的渲染失败时候,理论上我们应该给用户提供手动/自动重试机制 手动重试机制,简单的做法就是,在 fallback UI 中设置重试按钮 static getDerivedStateFromError...4.3 解决方案 因此,想要解决网络加载错误问题并重试,就得在声明代码 import 的时候处理,因为import 返回的是一个Promise,自然就可以用 .catch 捕获异常。...,并且可以重试一定次数,所以需要实现一个工具函数,统一处理 import() 动态引入可能失败的问题。...该工具函数如下: /** * * @param {() => Promise} fn 需要重试执行的函数 * @param {number} retriesLeft 剩余重试次数 * @param...4.4 表现效果 处理如下三种情况的效果: 正常按需加载组件成功 网络原因一直下载失败,展示兜底错误 网络原因,中途恢复,展示正常功能 录制的GIf比较大,微信上无法展示,可点击阅读全文查看效果!

    1.2K10

    性能优化竟白屏,难道真是我的锅?

    ,当组件按需加载的渲染失败时候,理论上我们应该给用户提供手动/自动重试机制 手动重试机制,简单的做法就是,在 fallback UI 中设置重试按钮 static getDerivedStateFromError...4.3 解决方案 因此,想要解决网络加载错误问题并重试,就得在声明代码 import 的时候处理,因为import 返回的是一个Promise,自然就可以用 .catch 捕获异常。...,并且可以重试一定次数,所以需要实现一个工具函数,统一处理 import() 动态引入可能失败的问题。...该工具函数如下: /** * * @param {() => Promise} fn 需要重试执行的函数 * @param {number} retriesLeft 剩余重试次数 * @param...4.4 表现效果 处理如下三种情况的效果: 正常按需加载组件成功 网络原因一直下载失败,展示兜底错误 网络原因,中途恢复,展示正常功能 三种情况下的处理效果 当我把网络加载失败后的处理结果给到QA同学

    91920

    RxJS 快速入门

    它比 Promise 可年轻多了,直到 1997 年才被人提出来。 顾名思义,FRP 同时具有函数式编程和响应式编程的特点。响应式编程是什么呢?...本文重点讲解一些传统方式下没有的或不常用的: retry - 失败重试 ? 有些错误是可以通过重试进行恢复的,比如临时性的网络丢包。...retry 操作符就是负责在失败时自动发起重试的,它可以接受一个参数,用来指定最大重试次数。 这里我为什么一直在强调失败重试呢?因为还有一个操作符负责成功重试。 repeat - 成功重试 ?...from 把数组打散了逐个放进流中,而 toArray 恰好相反,把流中的内容收集到一个数组中 —— 直到这个流结束。...TypeScript 的类型检查可以给你提供很大的帮助,既省心又安全,而且这两个都是微软家的,搭配使用,风味更佳。

    1.9K20

    从实现一个Promise说起

    reason: any // 异步函数执行失败后返回的值 onResolvedCallbacks: Function[] // 保存then方法添加的成功后执行函数 onRejectCallbacks...: Function[] // 保存then方法添加的失败后的执行函数 } enum STATUS { PENDING, FULFILLED, REJECTED } 接着动手实现一个Promise...Promise正好是一个订阅者模式的实现executor就是我们添加的订阅的数据源,我们向这个源注册了两个钩子resolve, reject,分别在异步事件的成功失败时执行,相当于订阅者的notify...(这里应该用类型判断) if (typeof then === 'function') { // 重复调用then方法, 直到res不再是一个Promise...执行成功方法,then是向该模型注册事件 Promise巧妙的利用发布订阅模式,将异步事件的发生与发生之后的执行解耦了,通过resolve钩子触发注册的函数,使得我们的关注点在then之后的方法 Typescript

    43330

    从实现一个Promise说起

    reason: any // 异步函数执行失败后返回的值 onResolvedCallbacks: Function[] // 保存then方法添加的成功后执行函数 onRejectCallbacks...: Function[] // 保存then方法添加的失败后的执行函数 } enum STATUS { PENDING, FULFILLED, REJECTED } 接着动手实现一个Promise...Promise正好是一个订阅者模式的实现executor就是我们添加的订阅的数据源,我们向这个源注册了两个钩子resolve, reject,分别在异步事件的成功失败时执行,相当于订阅者的notify...(这里应该用类型判断) if (typeof then === 'function') { // 重复调用then方法, 直到res不再是一个Promise...执行成功方法,then是向该模型注册事件 Promise巧妙的利用发布订阅模式,将异步事件的发生与发生之后的执行解耦了,通过resolve钩子触发注册的函数,使得我们的关注点在then之后的方法 Typescript

    69940

    实现TypeScript运行时类型检查

    0 }`);由于JSON.parser返回类型为any, 故在我们需要显示地声明user变量为User类型.但是如果JSON 数据为:{ "gender": 2}这个时候我们的parse 代码还是会成功运行...effect)进行收集.最直接的方式是抛出一个异常(Error), 但该方式会导致整个解析被终止.我们希望能够将一个个"小"解析器组合成"大"解析器, 所以不希望"大"解析器中的某一个"小解析器"的失败...A呢, 还是失败分支的E呢?....在Promise.then中, 这个上下文既是"有可能成功的异步返回值".得力于这种抽象, 我们可以摆脱call back hell和对状态的手动断言(GoLang 的r, err := f()).让我们思考一下..., 其实上文中提到的Either抽象同样符合这种运算:当Either处于成功的分支Right时, 对其进行进一步的运算.当Either处于失败的分支Left时, 直接返回当前的Either.其实现如下:

    2.5K30

    使用 promise 重构 Android 异步代码

    ,则通过延迟的方式来减少一次轮询请求 Promise.retry(),真正重试的逻辑,限定了最多重试次数和延时逻辑,RetryStrategy定义的是重试的策略,延迟(delay)多少和满足怎样的条件(...condition)才允许重试 这段代码把复杂的延时、条件判断、重试策略都通过Promise这个框架实现了,少了很多临时变量,代码量更少,逻辑更清晰。...并发模型 ● 多任务并行请求 Promise.all():接受任意个Promise对象,并发执行异步任务。全部任务成功,有一个失败则视为整体失败。...等待其中一个成功即为成功,全部任务失败则进入错误状态,输出错误列表。 ● 多任务竞速场景 Promise.race(): 接受任意个Promise对象,并发执行异步任务。...时间是第一优先级,多个任务以最先返回的那个结果为准,此结果成功即为整体成功失败则为整体失败。 扩展思考 Promise 最佳实践 1.

    27720

    手撕钉钉前端面试题

    { // 会产生请求成功和请求失败两种结果,返回的结果可能不唯一 return $.getJson(url, params); } // 纯函数 function request...Promise 对象的异步操作有三种状态: pending(进行中)、 fulfilled(已成功)和 rejected(已失败) ,只有 Promise 对象本身的异步操作结果可以决定当前的执行状态,...Promise 的状态只有两种变化可能:从 pending(进行中)变为 fulfilled(已成功)或从 pending(进行中)变为 rejected(已失败) 温馨提示:有限状态机提供了一种优雅的解决方式...Promise 还提供了其他的一些 API 方便多任务的执行,包括 Promise.all:适合多个异步任务并发执行但不允许其中任何一个任务失败 Promise.race :适合多个异步任务抢占式执行...Promise.allSettled :适合多个异步任务并发执行但允许某些任务失败 Promise 相对于 Callback 对于异步的处理更加优雅,并且能力也更加强大, 但是也存在一些自身的缺点: 无法取消

    3K20

    2024年2月前端资讯动态:JSR新仓库革新及Set方法等全新特性

    如果其中任何一个 Promise 失败,则整个 Promise.all() 调用会立即失败,返回第一个遇到的错误。这个方法非常适合并行执行多个异步任务时,只有当所有任务都成功完成后才继续执行。...Promise.allSettled() Promise.allSettled() 是对 Promise.all() 的补充,用于处理一个 Promise 数组,并等待所有 Promise 完成,无论是成功还是失败...这个方法非常适合你需要等待多个异步任务完成,并且需要知道每个任务的成功失败结果时使用。...Promise.any() Promise.any() 方法接收一个 Promise 数组,只要数组中的任何一个 Promise 成功解决,它就会解决,并返回第一个成功Promise 的结果。...,即使某些源失败了,你也希望知道哪些成功了,哪些失败了,以进行相应的处理。

    22610
    领券