重试的代码片段

最新推荐文章于 2023-08-12 11:27:06 发布

zsy_1991

最新推荐文章于 2023-08-12 11:27:06 发布

阅读量193

点赞数

分类专栏： rxjs Angular 前端文章标签： operator retry

本文链接：https://blog.youkuaiyun.com/zsy_1991/article/details/125222144

版权

前端同时被 3 个专栏收录

20 篇文章

订阅专栏

Angular

14 篇文章

订阅专栏

rxjs

2 篇文章

订阅专栏

这篇博客探讨了在 RxJS 中如何使用 catchError 操作符处理错误，并通过标志位控制重试次数。示例代码展示了自定义的 retryWithDelay 函数，它实现了延迟重试机制，允许在达到预设重试次数前不断尝试。此实践对于优化异步操作的健壮性至关重要。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.catchError 的第二个参数，直接返回就是代表重试，使用标志位控制重试次数

import { of } from 'rxjs/observable/of';
import { map, catchError } from 'rxjs/operators';

let flag = 0;
const source$ = of(1,2,3);
source$.pipe(map((v)=> {
	if (v%2 === 0 && flag < 3) {
		throw new Error('Bad Number')
	}
	return v;
}), catchError((err, caught$) => {
	flag++;
	console.log(`第${flag} 次重试： ${err.message}`);
	return caught$;
})).subscribe((res) => {
	console.log(res);
})

自定义retry

function retryWithDelay<T>( 
  delaySeconds: number,
  count = 1
): MonoTypeOperatorFunction<T> {
  return (input) => {
    return  input.pipe(retryWhen((errors) => {
      return errors.pipe(
        scan((acc, error) => ({ count: acc.count + 1, error }), {
          count: 0,
          error: undefined as any,
        }),
        tap((current) => {
          if (current.count > count) {
            throw current.error;
          }
        }),
        delay(delaySeconds)
      )
    })
  )} 
}