How can I handle authentication errors in Angular?

How can I handle authentication errors in Angular?

You can handle authentication errors in Angular by using HTTP interceptors to catch errors 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 unauthorized error
          console.error('Unauthorized access - redirecting to login');
        }
        return throwError(error);
      })
    );
  }
}

What should I do after catching the error?

After catching the error, you can redirect the user to the login page or display a notification about the error.