title: angular2 refresh token via service
body: <p>In my project the backend exposed refresh token api. When you log in you get valid token and refresh token. When the token expires you need to make a refresh call, authorized with the old expired token and parameter refresh token. The response returns new valid token and new refresh token. At the moment i am trying to implement it inside my authorization guard. This is the code:</p>
  
  <pre><code> import { Injectable } from '@angular/core';
   import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot }     from '@angular/router';
   import { Observable } from 'rxjs/Rx';
  
   import { SessionService } from '../services/session.service';
  
  @Injectable()
  export class AuthorizationGuard implements CanActivate {
  
  constructor(private sessionService: SessionService, private router: Router) { }
  
  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean | Observable&lt;boolean&gt; {
      if (this.sessionService.isAuthenticated() ) {
          console.log('guard has cookies');
          return true;
      } else {
          if(this.sessionService.checkStorageSession() == null) {
              this.router.navigate(['/']);
          } else {
              console.log('guard will refresh token via refresh token call  ');
              this.sessionService.refreshToken()
                  .subscribe(
                      data =&gt; {
                          console.log('guard  refresh success');
                          this.sessionService.destroySessionCookie();
                          this.sessionService.rememberUser(data.accessToken);
                          this.sessionService.rememberRefreshTocken(data.refreshToken);
                          this.sessionService.setSessionCookie(data.accessToken);
                          this.sessionService.setRefreshTocken(data.refreshToken);
                          return true;
                      },
                      error =&gt; {
                          console.log('session refresh fail: ' + error);
                          this.router.navigate(['/']);
                          return false;
                      }
              );
          }
      }
  }
  </code></pre>
  
  <p>}</p>
  
  <p>But the problem is canActivate invokes, the call starts, refreshes token but i get 403 unauthorized from other calls that are on the activated page  before the success response from the refresh. Also i cant figure out how to refresh token when i am standing on a page with save button, the token expires, i press save and update call is made, but with the expired token. Please suggest approaches :s</p>