How do I handle 401 errors in Angular?

How do I handle 401 errors in Angular?

To handle 401 errors in Angular, you can use an HTTP interceptor to catch the error responses globally.

Can you show me an example of an HTTP interceptor?

Sure! Here's a simple example:

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

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(req).pipe(
      catchError((error: HttpErrorResponse) => {
        if (error.status === 401) {
          // Handle 401 error
          console.error('Unauthorized access - 401');
        }
        return throwError(error);
      })
    );
  }
}

What should I do when I catch a 401 error?

When you catch a 401 error, you can redirect the user to the login page or show a message indicating that their session has expired.