Observable 中的 Promise 错误未调用 catch

Question

我正在使用 @angular/http 进行 http 调用 (Observable)，并使用 NativeStorage 库作为 Promise 的存储机制。这就是为什么我使用 FromPromise 将 Promise 函数 "NativeStorage.getItem("xxx")" 转换为 Observable.

我什至不确定这是否是一个好习惯，链条在 "console.log("HIT SUCCESSFULLY"); 处断了并停止执行代码。

由于存储中没有叫"externalAccessToken"的项目，Promise中catch异常null是正常的，但我不明白为什么之后就停止执行了。

到目前为止，我已经尝试 return 除 null 之外的其他内容并使用 "Promise.reject()" 导致 "Unhandled Promise rejection" 错误。

如何保持代码执行并命中 Observable 的 catch 函数

public getExternalAccessTokenFromStorage(): Observable<any> {
    let externalAccessTokenPromise = NativeStorage.getItem('externalAccessToken');
    let getExternalAccessTokenFromStorage: Observable<any> = Observable.fromPromise(externalAccessTokenPromise.then(x => x)
   .catch(() => {
        console.log("HIT SUCCESSFULLY");
        return null
   }));

    return getExternalAccessTokenFromStorage.map(x => {
        console.log("NOT HIT AT ALL");
        return x;
    }).catch(() => {
        console.log("NOT HIT AT ALL");
        return null;
    });
}



public getUserInfo(): Observable<StoredUserModel> {        
    //Get External Access Token From LocalStorage        

    return this.getExternalAccessTokenFromStorage().flatMap((x: IExternalAccessTokenBindingModel) => {
        return this.getAccessTokenFromStorage().flatMap((accessToken: AccessTokenModel) => {
            console.log("NOT HIT AT ALL");
            let headers = new Headers();
            headers.append("Authorization", "Bearer " + accessToken.access_token);
            headers.append("Content-Type", "application/json");
            let options = new RequestOptions({ headers: headers });
            var externalBindingModel = JSON.stringify(x);
            return this.http.post(this.baseUrl + '/api/Account/ExternalUserInfo', externalBindingModel, options).map((res: Response) => {
                //ADD USER INTO NATIVESTORAGE
                this.addUserIntoStorage(res.json());
                return res.json();
            });
        });
    }).catch(x => {
        return this.getAccessTokenFromStorage().flatMap((accessToken: AccessTokenModel) => {
            console.log("NOT HIT AT ALL");
            let headers = new Headers();
            headers.append("Authorization", "Bearer " + accessToken.access_token);
            let options = new RequestOptions({ headers: headers });
            return this.http.get(this.baseUrl + '/api/Account/UserInfo', options).map((res: Response) => {
                //ADD USER INTO NATIVESTORAGE
                let user: StoredUserModel = res.json();
                this.addUserIntoStorage(res.json());
                return user;
            });
        }).catch(error => {
            return null;
        });
    });
}

更新问题：

我删除了 Promise.catch 并保留了 Observable.catch 以便在 Observable 中捕获未处理的异常；

public getExternalAccessTokenFromStorage(): Observable<any> {
    let externalAccessTokenPromise = NativeStorage.getItem('externalAccessToken');
    let getExternalAccessTokenFromStorage: Observable<any> = Observable.fromPromise(externalAccessTokenPromise);

    return getExternalAccessTokenFromStorage.map(x => {
        return x;
    }).catch(() => {
        return null;
    });
}

我收到以下错误；

Answer 1

问题是您正在捕获错误，但没有处理错误。您将希望将错误作为 Observable 抛出。

public getExternalAccessTokenFromStorage(): Observable<any> {
    let externalAccessTokenPromise = NativeStorage.getItem('externalAccessToken');
    let getExternalAccessTokenFromStorage: Observable<any> = Observable.fromPromise(externalAccessTokenPromise);

    return getExternalAccessTokenFromStorage.map(x => {
        return x;
    }).catch((error: any) => 
        Observable.throw(error.json().error || 'Server error');
    );
}

然后您可以以承诺的形式处理您的响应和错误：

this.getExternalAccessTokenFromStorage().subscribe(
  res => console.log(res),
  error => console.log(error));

Answer 2

Catch 与编程中的 try / catch 子句完全相同。

举个例子：

try {
   throw new Error('bang');
} catch(ex) {
   // do nothing
}

console.log('I'm still reachable');

我们可以像这样用 observable 重现上面的内容：

let o = Observable.create((observer)=>{
     observer.error(new Error('bang'));
}).catch(()=>{ 
    // do nothing
});

o.subscribe(()=>{
   console.log('I'm still reachable');
});

如果您想捕获并处理错误，但随后使用 try / catch 阻止下面的代码执行，您可以这样做：

try {
   throw new Error('bang');
} catch(ex) {
   // do some logic here
   throw ex;
}

console.log('I cannot be reached');

在 observables 中也是一样的。您必须重新抛出错误或产生同样失败的可观察对象。

let o = Observable.create((observer)=>{
     observer.error(new Error('bang'));
}).catch((ex)=>{ 
    // do some logic here
    return Observable.throw(ex);
});

o.subscribe(()=>{
   console.log('I cannot be reached');
});

Observable 中的 Promise 错误未调用 catch

Promise Error in Observable not calling catch

javascript

angular-promise

angular2-observables

angular