title: Handling Expired Token From Api in Angular 4
body: <p>I need help in handling expired token in my angular application. My api has the expired time but my problem is when i forgot to log out of my angular application, after some time, i still can access the homepage but without data. Is there something i can do about this? Are there libraries that can handle this? or are there something i could install? Better, if i nothing will be installed. Here's my authentication code below? Can i add anything that can handle expiration and I won't be able to access the homepage if it expires.</p>
  
  <blockquote>
    <p>auth.service.ts</p>
  </blockquote>
  
  <pre><code> export class AuthService {
    private loggedIn = false;
  
    constructor(private httpClient: HttpClient) {
    }
  
    signinUser(email: string, password: string) {  
      const headers = new HttpHeaders() 
      .set('Content-Type', 'application/json');
  
      return this.httpClient
      .post(
        'http://sample.com/login', 
         JSON.stringify({ email, password }), 
         { headers: headers }
      )
      .map(
          (response: any) =&gt; {
            localStorage.setItem('auth_token', response.token);
            this.loggedIn = true;
            return response;
          });
     }
  
      isLoggedIn() {
        if (localStorage.getItem('auth_token')) {
          return this.loggedIn = true;
        }
      }
  
     logout() {
       localStorage.removeItem('auth_token');
       this.loggedIn = false;
      }
  }
  </code></pre>
  
  <blockquote>
    <p>authguard.ts</p>
  </blockquote>
  
  <pre><code>@Injectable()
  export class AuthGuard implements CanActivate {
  
    constructor(private router: Router, private authService: AuthService) {}
  
    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
  
      if (this.authService.isLoggedIn()) {
        // logged in so return true
        return true;
      }
  
      else {
        // not logged in so redirect to login page with the return url
        this.router.navigate(['signin'])
        return false;
        }
    }
  }
  </code></pre>