title: How to show an alert or toaster message when the JWT token expires in Angular 7
body: <p>When a JWT token expires, the web app should show an <code>alert</code> or modal pop up, then it should redirect to login page. Currently I am using toaster message.</p>
  
  <p>I have many api calls in my component. I get many toaster messages 'token expired'. I should show a message only and redirect to login page. tell me your good idea. I have some articles in the internet. But I could not get those things clearly.</p>
  
  <pre><code>import {
      HttpEvent,
      HttpInterceptor,
      HttpHandler,
      HttpRequest,
      HttpResponse,
      HttpErrorResponse
     } from '@angular/common/http';
  import { Observable, throwError } from 'rxjs';
  import { retry, catchError } from 'rxjs/operators';
  import { Router } from '@angular/router';
  import { ToastrManager } from 'ng6-toastr-notifications';
  import { Injectable } from '@angular/core';
  import { JwtDecoderService } from './jwt-decoder.service';
  
  @Injectable()
  export class HttpErrorInterceptor implements HttpInterceptor {
  
      constructor(public router: Router,
                  public toastr: ToastrManager,
                  private jwtDecoder: JwtDecoderService, ) {
      }
  
      intercept(request: HttpRequest&lt;any&gt;, next: HttpHandler): Observable&lt;HttpEvent&lt;any&gt;&gt; {
        if (localStorage.getItem('isLoggedin') === 'false' &amp;&amp; !this.jwtDecoder.isTokenExpired()) {
          this.toastr.warningToastr('Token expired');
          return;
        }
        return next.handle(request)
          .pipe(
            catchError((error: HttpErrorResponse) =&gt; {
              let errorMessage = '';
              if (error.error instanceof ErrorEvent) {
                // client-side error
                errorMessage = `Error: ${error.error.message}`;
              } else {
                // server-side error
                errorMessage = `Error Code: ${error.status}\nMessage: ${error.message}`;
                if (error.status === 404) {
                  this.toastr.warningToastr('Server Not Found');
                  this.router.navigate(['/login']);
                }
                if (error.status === 412) {
                  this.toastr.warningToastr('Token expired');
                  this.router.navigate(['/login']);
                }
                // if (error.status === 500 || error.status === 400) {
                //   this.toastr.errorToastr('We encountered a technical issue');
                // }
              }
              // return throwError(errorMessage);
              return throwError(error);
            })
          );
      }
     }
  </code></pre>