A煤n no tienes acceso a esta clase

Crea una cuenta y contin煤a viendo este curso

Manejo de errores

14/25
Recursos

Aportes 9

Preguntas 0

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesi贸n.

La idea no ser铆a crear este m茅todo manejador de errores en todos los servicios, podr铆amos crear una funci贸n en la carpeta Utils, que se cre贸 en el curso de Angular (anterior) para as铆 poder reutilizar esta funci贸n en la mayor cantidad de servicios que se pueda. Podr铆a ser algo as铆:

import { HttpErrorResponse} from '@angular/common/http'

import { throwError } from 'rxjs'

export function HandleHttpResponseError(error: HttpErrorResponse) {
	console.log(error)
	return throwError('Mi mensaje de error')
}

y simplemente la usamos en cualquier servicio

import { HandleHttpResponseError } from 'src/app/utils/HandleHttpResponseError'
...
getRandomUsers(): Observable<User[]> {
		return this.httpClient.get('https://randokldfjsdlmuser.me/api/?results=2')
		.pipe(
			catchError(HandleHttpResponseError),
			map((response: any) => response.results as User[]),
		);
	}	

Al momento de realizar consultas http es recomendable capturar errores al momento de hacer consumo de estos servicios para poder debuggear de mejor forma a futuro.

Existen dos m茅todos la momento de capturar el error.

La primera es hacer la captura del error pero a nivel de componente, esto es 煤til si queremos capturar esos errores y notificar al usuario a trav茅s de un mensaje en la vista, que ha ocurrido un error.

Para esto, solo tenemos que agregar otro par谩metro en nuestro m茅todo subscribe, cuando nos suscribimos a un observable:

fetchProducts(): void {
    this.productService.getAllProducts().subscribe(
      (products) => (this.products = products),
      (error) => console.error(error)
    );
  }

Pero si queremos hacer una captura de errores de forma estad铆stica y ordenada, es recomendable hacer esta captura de errores a nivel de servicio y no a nivel de componente (Tambi茅n se puede realizar ambos casos al mismo tiempo).

Para ello usaremos el operador 鈥渃athError鈥 de la librer铆a rxjs y el m茅todo 鈥渢rhowError鈥 de la librer铆a http para mostrar el error (es equivalente a usar el m茅todo de js console.error()).

Ejemplo:

Funci贸n #1: lo que hacemos en esta funci贸n es usar un pipe durante la observaci贸n y utilizamos el operador 鈥渃atchError鈥 para atrapar un error, como se puede notar, es recomendable colocar el operador de primero.

getRandomUsers(): Observable<User[]> {
    return this.http.get('https://ra2ndomuser.me/api/?results=2').pipe(
      catchError((error) => this.handleError(error)),
      map((response: any) => response.results as User[])
    );
  }

Funci贸n #2: usamos la funci贸n " handleError" para simplemente tener una funcion que capture el error de todos nuestros consumos a cualquier servicio, es recomendable tipar los errores de http con el tipo de dato llamado 鈥淗ttpErrorResponse鈥.

private handleError(error: HttpErrorResponse): Observable<never> {
    console.log(error);
    return throwError('ups algo salio mal');
  }

No es mejor usar un interceptor?

Muy interesante la forma de capturar estos errores. Mi duda es, si quieres devolver un mensaje distinto dependiendo de la petici贸n como lo har铆as ?

bastante picante la manera de capturar los errores 鉂

buena clase

Esta es una buena soluci贸n para un solo servicio, pero una aplicaci贸n real contiene numerosos servicios que pueden producir errores. Desafortunadamente, esta soluci贸n requiere copiar la funci贸n en todos los servicios, que es un anti-patr贸n en el desarrollo angular

. Si la forma en que manejamos los errores necesita cambiar, entonces tenemos que actualizar cada funci贸n en cada servicio. Esto es contraproducente y puede conducir f谩cilmente a m谩s errores. Necesitamos una manera eficiente de manejar los errores globalmente en toda la aplicaci贸n. Una mejor soluci贸n es usar HttpInterceptor

Para este caso tendr铆a que crear un m茅todo handleError por cada servicio, hay manera de hacer ese m茅todo como un servicio y utilizarlo en cada petici贸n?

Entonces lo recomendable es trabajar los errores por cada service???,

La propuesta de trabajarlo por Interceptor no es mala, yo estoy probando y me ha funcionado, ya q de esta forma los centralizo.

Igual ya el error lo traes del backend y la idea es tratar de manejar lo mayor posible los errrores desde este鈥

Hasta el momento estoy incursionando con los interceptor, veremos a ver q pasa.