Retry Failed Requests with RxJS and the HttpClient in Angular

Share this video with your friends

Send Tweet

When the communication with the backend fails, before giving the user a negative response, it might be worth trying to automatically recover from the error. In some cases, that can be as simple as retrying to issue the request again. Since the Angular HttpClient heavily relies on RxJS we can apply some of its operators to make this happen, such as retry, retryWhen and delay.

Alplob
Alplob
~ 7 years ago

Hi Juri, thanks a lot for this course, I really appreciated it. So far I have just one suggestion: I think it would worth to explain how to implement properly the operator Timeout of rxjs with this.

Juri Strumpflohner
Juri Strumpflohner(instructor)
~ 7 years ago

Hey @alplob. Thx for your suggestion. Could you however explain in more detail what you'd like to see related to "timeout"? You mean at the Angular HTTP level?

Alplob
Alplob
~ 7 years ago

Yes, I mean at the Angular HTTP level. I am developing a mobile app with Ionic and in some (bad) situations the response to the request can be very long, that is why I use Timeout with http calls that may impact the end user experience. Just a remark when the timeout is raised by rxjs, the resulting err is an "instanceof Error" but there is no err.error.message, just err.name (this refers to the previous video of this course).

Roland Pangu
Roland Pangu
~ 6 years ago

If you're running the latest version of rxjs, this will not work. You will have to have it like this: `
this.people$ = this.peopleService .fetchPeople() .pipe( retryWhen(error => { let retries = 3;

     return error.pipe(
       delay(1500),
       flatMap(err => {
         if (retries-- > 0) {
           return of(err);
         }
       })
     );
   })
 )`

And you will also have to import the operators differently: import { delay, retryWhen, flatMap } from 'rxjs/operators'; import { of } from 'rxjs';

Juri Strumpflohner
Juri Strumpflohner(instructor)
~ 6 years ago

@Roland you're right. I already scheduled this course for being updated. Just finished the just bits of some new releases & then I'll update this one 👍