How can I use Angular CLI interceptors for advanced use cases?

How can I use Angular CLI interceptors for advanced use cases?

You can use Angular CLI interceptors to handle HTTP requests and responses globally. This allows you to modify requests, add headers, or handle errors in a centralized manner.

Can you give me an example of modifying a request with an interceptor?

Sure! You can create an interceptor that adds an authorization token to every outgoing request. Here's a simple example:

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

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const cloned = req.clone({
      headers: req.headers.set('Authorization', 'Bearer your-token')
    });
    return next.handle(cloned);
  }
}

What about handling errors in an interceptor?

You can handle errors by catching them in the interceptor. For example, you can log the error or redirect the user to a login page if they receive a 401 Unauthorized response.

Thanks! Where can I learn more about Angular interceptors?