CODEWITHSUNDEEP
angularapihttprxjsswitchmap
Sahil Manaktala
Sahil Manaktala

Reputation: 21

RXJs Switch Map flow and API cancellation

I am working on an existing Angular application and there is an issue where the APIs keep getting cancelled sometimes. It is mostly happening on Development site but not on local.

somefunctionName(x) {
this.service.serviceFunction(x.id, x.otherId).subscribe(_ => {
    -- do something --
  });
}

<- Service File -> 
serviceFunction(id?: number, otherId?: number): Observable<void> {
return this.http.post<context>(`url`, { id, otherId })
  .pipe(
    tap(y => {
      this.someFunction(y);
      this._variable.next();
    }),
    switchMap(() => this.targetFunction())
  );
}

private targetFunction(): Observable<any> {
return forkJoin([
  this.firstAPICall(),
  this.secondAPICall(),
  this.thirdAPICall(),
  this.fourthAPICall()
]);
}

I have a function 'someFunctionName' which is calling the serviceFunction and uses SwitchMap to call targetFunction. The APIs inside the target function are getting cancelled. I have never worked with switchMap but I have basic understanding about it. Could someone please explain the flow and some pointers on why the API are getting cancelled?

EDIT: Please find below the steps executed to debug the issue:

Console and Session Storage Testing – Adding console logs and stored various requests hitting the interceptor but none of them went into error exception when the APIs are getting cancelled.

Checked the possibility of unsubscribed observable emitting any values while the APIs are running as it might be causing some conflict, so I moved the route to another screen at the end when all the four APIs inside the fork Join are executed but it did not work.

Cancelling of APIs could have happened because of SwitchMap but this had lesser probability since SwitchMap only cancels if the outer observable is called again but that was not happening still to rule this out, I replaced SwitchMap with MergeMap but the APIs were still getting cancelled. (Thanks to Chris in the comments for detailed explanation regarding SwitchMap)

Added catchError at the end of ForkJoin and at the end of all 4 APIs which are getting cancelled but the flow did not go into catch block.

Tried executing each of the APIs individually using POSTMAN and all were successful. I am trying to run them in parallel too using POSTMAN to check if the error is happening during parallel execution.

On the Dev site, while pausing on exceptions I did find an error Array.Prototype.ForEach called on Null or undefined but it happened once when the APIs did not cancel so I do not think the issues are related.

Upvotes: 0

Views: 688

Answers (1)

Romario Putra
Romario Putra

Reputation: 61

I need context for when someFunctionName function is called, because switchMap will complete inner observable if there is a new emit from outer observable (in this case is this.http.post(url, { id, otherId })). Maybe you accidentally called someFunctionName() multiple times? You can check the network tab.

Upvotes: 0

Related Questions