Angular2中的REST服务异常处理

首先，我必须提到，我是Angular的初学者，我的示例代码有点结巴

我创建了一些简单的登录应用程序，它提示输入用户名和密码，调用登录REST服务（用Java编写），在登录成功时返回一些令牌，或者在登录失败时抛出异常

这是我的一些代码

登录组件：

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

import { AuthenticationService } from '../_services/index';

@Component({
    moduleId: module.id,
    templateUrl: 'login.component.html'
})

export class LoginComponent implements OnInit {
    model: any = {};
    error = '';

    constructor(
        private router: Router,
        private authenticationService: AuthenticationService) { }

    ngOnInit() {
        // reset login status
        this.authenticationService.logout();
    }

    login() {
        this.authenticationService.login(this.model.username, this.model.password)
            .subscribe(result => {
                if (result === true) {
                    this.router.navigate(['/']);
                } else {
                    this.error = 'Login failed!';
                }
            },
            err => {
                this.error = 'Login failed!';
            });
    }
}

身份验证服务：

import { Injectable } from '@angular/core';
import { Http, Headers, RequestOptions, Response } from '@angular/http';
import { Observable } from 'rxjs';
import { CookieService } from 'angular2-cookie/core';
import { CookieOptionsArgs } from 'angular2-cookie/services/cookie-options-args.model';
import 'rxjs/add/operator/map';

@Injectable()
export class AuthenticationService {
    public token: string;

    constructor(private http: Http, private cookieService: CookieService) {
        // set token if saved in cookie
        this.token = cookieService.get('token');
    }

    login(username, password): Observable<boolean> {
        return this.http.post('http://localhost:9081/MyApp/login?username=' + username + '&password=' + password, new RequestOptions({}))
            .map((response: Response) => {
                // login successful if there's a token in the response
                let token = response.text();
                if (token !== '-1') {
                    // set token
                    this.token = token;

                    // store token in cookie to keep user logged
                    let opts: CookieOptionsArgs = {
                        path: '/'
                    };
                    this.cookieService.put('token', token, opts);

                    // return true to indicate successful login
                    return true;
                } else {
                    // return false to indicate failed login
                    return false;
                }
            });
    }

    logout(): void {
        // clear token, remove cookie to log user out
        this.token= null;
        this.cookieService.remove('token');
    }
}

从'@angular/core'导入{Injectable}；
从'@angular/Http'导入{Http，Headers，RequestOptions，Response}；
从“rxjs”导入{Observable}；
从'angular2 cookie/core'导入{CookieService}；
从“angular2 cookie/services/cookie options args.model”导入{CookieOptions args}；
导入'rxjs/add/operator/map'；
@可注射（）
导出类身份验证服务{
公共令牌：字符串；
构造函数（私有http:http，私有cookieService:cookieService）{
//设置保存在cookie中的令牌
this.token=cookieService.get（'token'）；
}
登录（用户名、密码）：可观察{
返回此.http.post（'http://localhost:9081/MyApp/login?username='+username+'&password='+password，新请求选项（{}））
.map（（响应：响应）=>{
//如果响应中有令牌，则登录成功
让token=response.text（）；
如果（令牌！='-1'）{
//设置令牌
this.token=token；
//将令牌存储在cookie中以保持用户日志记录
让选项：CookieOptions参数={
路径：'/'
};
this.cookieService.put（'token'，token，opts）；
//返回true表示成功登录
返回true；
}否则{
//返回false表示登录失败
返回false；
}
});
}
注销（）：void{
//清除令牌，删除cookie以注销用户
this.token=null；
this.cookieService.remove（'token'）；
}
}

一切正常。登录成功后，将返回令牌，并将我重定向到“主页”。否则，登录页面上会出现“登录失败”消息，并且不会发生重定向。困扰我的是，我不知道为什么登录失败：是因为用户名不存在，还是因为密码错误。处理REST服务引发的异常的正确方法是什么？我假设身份验证服务是正确的地方，但我不知道该怎么做。我试图从请求对象中提取一些信息，但若引发异常，则请求映射不会发生

---

谢谢你的帮助

您似乎在寻找捕获AuthenticationService中错误登录时发生的异常。如果是在.map之后添加.catch部分，如本主题：

---

我以这种方式实现了我的代码：

  login(email: string, password: string): Observable<boolean> {
    return new Observable(observer => {
      var data = { email: email, password: password };
      this.http.post(this.server_url + '/auth/authenticate', data).subscribe(x => {
        var result = {
          email: x.json().email,
          token: x.json().token,
          roles: x.json().roles.map(x => x.name)
        }
        localStorage.setItem(this._userKey, JSON.stringify(result));
        observer.next(true);
        observer.complete();
      }, er => {
        if (er.status == 401) {
          observer.next(false);
          observer.complete();
        } else {
          console.log(er);
          observer.error(er);
          observer.complete();
        }
      });
    });
  }

---

如果您在catch参数的Observable方面遇到错误，以下内容将有所帮助

  login(email: string, password: string): Observable<boolean> {
    return new Observable(observer => {
      var data = { email: email, password: password };
      this.http.post(this.server_url + '/auth/authenticate', data).subscribe(x => {
        var result = {
          email: x.json().email,
          token: x.json().token,
          roles: x.json().roles.map(x => x.name)
        }
        localStorage.setItem(this._userKey, JSON.stringify(result));
        observer.next(true);
        observer.complete();
      }, er => {
        if (er.status == 401) {
          observer.next(false);
          observer.complete();
        } else {
          console.log(er);
          observer.error(er);
          observer.complete();
        }
      });
    });
  }

  login() {
    this.loading = true;
    this.authenticationService.login(this.model.username, this.model.password)
      .subscribe(result => {
        if (result == true) {              
          this.router.navigate(['/home']);
        } else {
          this.error = 'Username or password is incorrect';
          this.loading = false;
        }
      }, err => {
        this.error = 'Unexpected error occured.. please contact the administrator..';
        this.loading = false;
      });
  }