HTTP interceptors are a powerful feature that allows you to intercept HTTP requests and responses.They provide a way to handling errors, and transforming responses globally across your application. If you want to handle exceptions globally for HTTP requests.
Step 1: Create an Interceptor
import { HttpInterceptor, HttpHandler, HttpRequest, HttpEvent, HttpResponse, HttpErrorResponse } from ‘@angular/common/http’;
import { Injectable } from “@angular/core”;import { Observable, of, pipe } from “rxjs”;import { tap, catchError } from “rxjs/operators”;
import { Router } from ‘@angular/router’;import { ToastrService } from ‘ngx-toastr’;
@Injectable({ providedIn: ‘root’})
export class AppHttpInterceptor implements HttpInterceptor {
constructor(private router: Router,private toastr: ToastrService){ }
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
req = req.clone({
withCredentials :true
});
return next.handle(req)
.pipe(catchError((error,caught) => {
console.log(error);
if(error.status === 0){
this.router.navigate([‘login’]);
}
this.toastr.error(‘Service is not available !’, ‘503 – SERVICE DOWN !’);
return Observable.throw(error);
}) as any);
}
}
Step 2: Provide the Interceptor
Add provider in app.module.ts
{provide: HTTP_INTERCEPTORS, useClass: AppHttpInterceptor, multi: true}
Now, whenever there is an HTTP error in your application, the catchError
operator in the interceptor’s intercept
method will be triggered. You can handle the error, log it, transform it, or rethrow it as needed.
3 Replies to “HTTP Interceptors as Your Exception Handling Heroes”