Question

首先，我必须提到我是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');
    }
}

一切都按预期工作。登录成功后，将返回令牌，并将我重定向到＆＃34; home＆＃34;页。否则，＆＃34;登录失败＆＃34;消息显示在登录页面上，不会发生重定向。困扰我的是，我并不确切地知道登录失败的原因：是因为用户名不存在，还是因为密码错误。处理REST服务引发的异常的正确方法是什么？我认为身份验证服务是正确的，但我不知道如何做到这一点。我试图从请求对象中提取一些信息，但是如果抛出异常，请求映射不会发生。

感谢您的帮助！

Answer 1

您似乎正在寻找在AuthenticationService中捕获错误登录时发生的异常。如果是这样的话，请在.map之后添加.catch部分，就像在这个主题中一样： best practives catching error Angualr 2

        .catch((error: any) => {     //catch Errors here using catch block
            if (error.status === 500) {
                // Display your message error here
            }
            else if (error.status === 400) {
                // Display your message error here
            }
        });

Answer 2

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

  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;
      });
  }

所以它处理三种可能性：

如果cridential是OK则返回true
如果凭据错误则返回false（请记住您的服务器必须返回401状态！）
否则服务器出现问题并抛出错误

在处理程序中我得到了：

{{1}}

Angular2中的REST服务异常处理

2 个答案: