javascript - ¿Cómo puedo cancelar una solicitud API en mi efecto de ngrx?

Entonces, en una página determinada, puedo despachar varias acciones para ejecutar una solicitud de búsqueda, todas en el mismo endpoint de la API. En mis efectos, tengo un efecto para hacer esta solicitud que se ve algo así:

    runSearchSuccess$ = createEffect(() =>
    this.actions$.pipe(
            ofType(MyActions.runSearch),
            mergeMap(({searchRequest}) => this.myService.runSearch(searchRequest).pipe(
                map((response) => {
                    return MyActions.runSearchSuccess({ searchResponse: response })
                }),
                catchError(error => {
                    const searchResponse = null;
                    return [
                        MyActions.updateSearchStatuses({searchResponse}),
                    ]
                }),
            )),
        )
    );

Estas solicitudes pueden tardar mucho tiempo, así que si la entrada del usuario en la página cambia, algunas solicitudes que se están ejecutando pueden volverse innecesarias y necesitar ser canceladas. Los datos sobre qué solicitudes de búsqueda son relevantes están en el store, así que tengo un selector para obtener todas ellas. Lo que quiero hacer es vigilar los cambios en este selector y, si en algún momento la solicitud de búsqueda deja de ser relevante, quiero cancelarla. No creo que pueda usar TakeUntil porque solo depende de lo que viene del selector. He intentado usar TakeWhile, pero no encuentro una manera de que realmente cancele la llamada a la API y no solo el efecto. ¿Hay alguna manera de lograr esto con TakeWhile, o hay una forma mejor de gestionar mis llamadas de red activas y cancelarlas cuando sea necesario?

Respuesta #1

Necesitarás reemplazar mergeMap con switchMap. La diferencia es que mergeMap ejecuta todas las solicitudes en paralelo, mientras que switchMap cancelará las solicitudes pendientes cuando haya una nueva solicitud.

Documentos :

• https://rxjs.dev/api/operators/mergeMap
• https://rxjs.dev/api/operators/switchMap