TransWikia.com

Obtener error 404 Angular 4

Stack Overflow en español Asked by Gerardo Gutiérrez on November 24, 2021

Quisiera saber como capturar el error 404 de pagina no encontrada para integrarla a mi web, hasta el momento he modificado el routing y los los paths de mi web para que cuando no encuentre la ruta de una pagina me muestre una pagina con la descripción del error 404.

 const routes: Routes = [
  {
    path: '**',
    component: NotFoundComponent
  }
];

Esta solución aparentemente funciona, sin embargo quiero saber cuando el servidor me responde con un 404 para así mostrar una pagina al cliente diciendo que hubo un error 404.

One Answer

Puedes utilizar un HttpInterceptor que observe las peticiones Http de tu aplicación y ejecute ciertas acciones de acuerdo a las peticiones/respuestas de cada request.

app.interceptor.ts

import { Injectable } from "@angular/core";
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from "@angular/common/http";
import { Observable } from "rxjs";

@Injectable()
export class AppInterceptor implements HttpInterceptor {

    constructor() {}

    intercept(req: HttpRequest<any>,
            next: HttpHandler
            ): Observable<HttpEvent<any>> {

        return next.handle(request).do((event: HttpEvent<any>) => {}, (error: any) => {

            // Si sabes que el servidor hace el handling de las "error responses"
            // es decir, si el servidor devuelve los errores como instancias de HttpErrorResponse
            if (err instanceof HttpErrorResponse) {
                if (error.status === 404) {
                    // realiza la acción que necesites, 
                    // en tu caso la redirección a la ruta para 404 que creaste
                }

                if (error.status === 500) {
                    // otra acción distinta, por ejemplo...
                }
            }
        });
    }
}

Recuerda que el servidor debe tratar las respuestas con error como instancias de HttpErrorResponse, lo cual es habitual, pero no está demás tenerlo en cuenta.

Answered by David Mork on November 24, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP