带有rxjs的Angular帖子:catch错误

时间:2017-09-06 18:48:48

标签: angular rxjs

我在几个教程的帮助下,在我的角度应用程序中创建了一个身份验证服务。幸福的道路工作正常,但我无法处理401错误等。在这种情况下,我的地图功能不会被调用。

如何处理登录错误?

login(username: string, password: string): Observable<boolean> {

        return this.http.post(environment.baseUrl + '/api/authenticate', JSON.stringify({ username: username, password: password }))
            .map((response: Response, error: any) => {

                console.log('mapping response...', response.status.toString());

                // login successful if there's a jwt token in the response
                const 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;
                }
            });

    }

2 个答案:

答案 0 :(得分:2)

您可以尝试添加这样的捕获:

    return this.http.post(environment.baseUrl + '/api/authenticate', JSON.stringify({ username: username, password: password }))
        .map((response: Response) => {

            console.log('mapping response...', response.status.toString());

            // login successful if there's a jwt token in the response
            const 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(this.handleError);


private handleError(error: Response): Observable<any> {
    // in a real world app, we may send the server to some remote logging infrastructure
    // instead of just logging it to the console
    console.error(error);
    return Observable.throw(error.json().error || 'Server error');
}

或者要返回false,您可以按如下方式更改:

import 'rxjs/add/observable/of';

private handleError(error: Response): Observable<any> {
    // in a real world app, we may send the server to some remote logging infrastructure
    // instead of just logging it to the console
    console.error(error);
    return Observable.of(false);
}

答案 1 :(得分:-1)

您可以尝试:

app.config(['$httpProvider', function($httpProvider) {

    $httpProvider.interceptors.push(function($q) {

        return {

            'responseError': function(rejection){

                var defer = $q.defer();

                if(rejection.status == 401){
                    console.dir(rejection);
                }

                defer.reject(rejection);

                return defer.promise;

            }
        };
    });

    }]);