Search code examples
angularhttpangular-httpclient

Duplicate request is always performed when the request throws an error


I have a weird problem.

I have a service, which gets data from the Back-end and a function like this:

  validateChangEmailTokenAndChangeEmail(token: string): Observable<User>
  {
    const callUrl = environment.apiUrl + `users/validate-change-email-token-and-change-email`;
    return this.http.post<User>(callUrl, token, environment.httpOptions)
      .pipe(shareReplay(), retry(0));
  }

My problem is that when I subscribe to this observable (which is subscribed only once when a component is initialized) and the BE throws an error, the request will be done one more time. I have tried adding shareReplay(), retry(0) and take(1). But still no success.

This is my subscription:

this.userService.validateChangEmailTokenAndChangeEmail(this.token)
      .subscribe(user => {
       // my logic

      }, error =>
      {
        // handling of error
        this.handleError(error);
      });

The function this.handleError() will be called only once. Which means that the duplicate request is not really taken and processed.

Check the below screenshot. The request error is logged 2 times, the WTF (which comes from handleError()) only once.

Errors

What could it be?

What I have also noticed, is that the subscription will always take the second request.


Solution

  • I found the problem that I had.

    Basically I had implemented a class called HttpErrorInterceptor which had a pipe with retry(1) inside. That is why each request that resulted in an error was duplicated.