使用localStorage和http api调用的angular 2登录流程

Question

我对angular 2非常新，我正在尝试让我的登录流程完成。我将用户凭据发布到api并接收jwt令牌。然后我用这个令牌请求用户详细信息并将所有信息存储在localStorage中，但我不确定它是否正确，有时候我有问题。

登录方法

  login(user): Promise<any> {
localStorage.clear();
return this.http
  .post(`${this.url}/auth/login_check`, JSON.stringify(user), { headers: this.headers }).toPromise().then(resp => {
    let json = resp.json();
      if (json.token){
        console.log('token exists')
        localStorage.setItem('jwt_token', json.token);
        this.storeUser().then(resp => {
          console.log('user exists')
          return true;
        }, err => {
          this.handleError(err);
          return false;
        })
      }
      else {
        return false;
      }
    },
    err => {
      this.handleError(err);
      return false;
    })
  };

storeUser方法

  storeUser(): Promise<any> {
this.headers.append('Authorization', 'Bearer '+localStorage.getItem('jwt_token'));
console.log(this.headers);
return this.http.get(`${this.url}/users/0`, { headers: this.headers }).toPromise().then(resp => {
  let json = resp.json();

  let picture = 'data:image/jpeg;base64,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';

  localStorage.setItem('user_id', json.id);
  localStorage.setItem('user_username', json.username);
  localStorage.setItem('user_email', json.email);
  localStorage.setItem('user_enabled', json.enabled);
  localStorage.setItem('user_last_login', json.last_login);
  localStorage.setItem('user_roles', json.roles);
  localStorage.setItem('user_validated', json.validated);
  localStorage.setItem('user_picture', picture);
  console.log(localStorage.getItem('user_username'));
  return true;
},
err => {
  this.handleError(err);
  return false;
});

}

登录组件中的signIn方法

  signIn() {
this.processing = true;
this.active = true;
this.error = false;
this.success = false;

this.authSvc.login({ username: this.loginForm.value['username'], password: this.loginForm.value['password'] }).then(resp => {

  this.processing = false;
  this.success = true;
  this.router.navigateByUrl('');
}, err => {
  this.processing = false;
  this.error = true;
})

};