Angular 2 捕获 401 响应

Question

在 Angular2/Node 上工作。

对于登录，我们有以下内容

login(username: string, password: string): Observable<boolean> {
  return this.http.post('http://localhost:3000/api/login', { email: username, password: password })
  .map((response: Response) => {
    // login successful if there's a jwt token in the response

    let token = response.json() && response.json().token;
    if (token) {
      // set token property
      this.token = token;

      // store username and jwt token in local storage to keep user logged in between page refreshes
      localStorage.setItem('currentUser', JSON.stringify({ username: username, token: token }));
      // return true to indicate successful login
      return true;
    } else {
      // return false to indicate failed login
      return false;
    }
  }).catch(err =>{
    if (err.status === 401)
    {
      console.log("caught 401 exception");
      return false;
    }
  });

问题是我收到以下错误

'(err: any) => boolean' 类型的参数不能赋值给 '（错误：任何，捕获：Observable）类型的参数=> 可观察输入'。类型“布尔”不可分配给类型 '可观察输入'。

我不确定我需要改变什么才能让它能够赶上 401

为了测试登录看起来如下

this.webapiService.login("Donald@geek.com","moneyIsGood").subscribe(result => {
  if (result === true) {
    console.log('Username or password is correct');
  } else {
    console.log('Username or password is incorrect');
  }
});

编辑：似乎我错过了关于同时使用 .catch 和订阅的一点，但仍然不确定如何以及为什么。

Answer 1

您可以删除此代码：

.catch(err =>{
    if (err.status === 401)
    {
      console.log("caught 401 exception");
      return false;
    }
  });

或者改为添加日志记录和抛出异常：

.catch(err => {
       console.log("caught exception" + err.status);
       return Observable.throw(err);
 });

另外加入订阅：

this.webapiService.login("Donald@geek.com","moneyIsGood").subscribe(result => {
     console.log('Username or password is correct');
   }, error => {
      if (error.status === 401){
        console.log('Username or password is incorrect');
      }
});

Answer 2

你可以捕捉到这样的错误

this.http.post('http://localhost:3000/api/login', { email: username, password: password })
.catch((error: any) => this.handleError(error))
.map((response: Response) => {