首页 文章

在RxJS TypeScript中正确捕获值(Angular 2)

提问于
浏览
0

我'm learning Angular2, coming from years of development in Angular 1.x. I'遇到了RxJS的一些问题,特别是如何捕获和处理错误 . 在我的例子中,我似乎让错误处理以我期望的方式工作 .

方法调用层次结构如下

SignInComponent.facebookLoginResponse
    => AuthService.facebookLogin
        => APIService.Post

当服务器返回错误(状态代码4xx)时,我希望客户端映射错误并在我的SignInComponent错误处理块中捕获它 . 相反,控制台显示以下错误(从不调用 ErrorHandler.handle ):

-> EXCEPTION: [object Object]                core.umd.js:3488
-> Uncaught > Object {errors: Array[1]}      Subscribe.ts:241

以下是相关的代码片段

export class SignInComponent{
    ...
    public facebookLoginResponse(response : FB.LoginStatusResponse){
        if (response.status == "connected"){
            let observable = this.auth.facebookLogin(response.authResponse.accessToken);

            observable.subscribe(() => {
                this.router.navigate(['influencer']);
            }, (error : ErrorResponse) => {
                ErrorHandler.handle(error, "Couldn't log in due to the following reasons:");
            });
        }
    }
    ...
}

export class Auth{
    ...
    facebookLogin(accessToken : String) : Observable<AuthResponse>{
        let observable = this.api.Post<AuthResponse>("influencer/auth/facebook", {
            token: accessToken
        });

        observable.subscribe((response : AuthResponse) => {
            Auth.handleAuthSuccess(response, SessionType.Influencer);
        });

        return observable;
    }
    ...
}

export class API{
    ...
    public Post<T>(path : String, postData) : Observable<T>{
        return this.http.post(this.basePath + path, postData)
            .map((response : Response) => {
                return API.extractData<T>(response);
            })
            .catch(API.handleError)
            .share();
    }

    private static extractData<T>(response : Response) : T{
        return <T>response.json();
    }

    private static handleError (error: Response) {
        let errorResponse : ErrorResponse;
        ...
        return Observable.throw(errorResponse);
    }
    ...
}

似乎 API.Post 中的 share 调用打破了错误处理 . 但是如果没有它,请求将被发送多次,因为我们订阅了observable(在这种情况下,两次) . 我该怎么做才能正确?

1 回答

  • 0

    不确定以下是否适用于您的情况,但在大多数情况下"splitting up"在编写顺序进程时不需要进入多个订阅的流(在大多数情况下应该没问题,因为无论如何都有onyl 1线程),在您的情况下尝试删除 share() 并使用以下内容:

    export class Auth {
        ...
        facebookLogin(accessToken : String) : Observable<AuthResponse>{
            return this.api.Post<AuthResponse>("influencer/auth/facebook", {
                token: accessToken
            })
            .do((response : AuthResponse) => Auth.handleAuthSuccess(response, SessionType.Influencer));
        }
        ...
    }
    

相关问题