Angular2 Auth Guard 返回带有 Observable.of(true) 的空白页

Question

我正在使用 auth-guard 来保护我的一些路由，在检查身份验证的同时，如果当前令牌将在 15 分钟内过期，我将获得一个刷新令牌。我的 authenticated() 方法是 returning 一个 Observable。

问题是当它去获取刷新令牌时它显示一个空白页面，即使它到达 returning Observable.of(true) 的代码（至少它显示在控制台中）。控制台没有错误。

如果我没有得到刷新令牌（还不是时候），那么我也 return 真正的 Observable 并且它工作正常。

在授权保护中：

canActivate(): Observable<boolean> {
    return this.auth.authenticated();
}

在auth.service中：

authenticated(): Observable<boolean> {
    if (isStillValid && currentTime.isAfter(refreshTime)) {
      return this._refreshAuthToken()
        .map((data) => {
          //****IT GETS HERE, BUT DISPLAYS BLANK ****
          return Observable.of(true);
        })
        .catch(() => {
          return Observable.of(false);
        });
     } else {
        if (!isStillValid) {
          //redirects to login
          return Observable.of(false);
        }
          return Observable.of(true);
        }
     }
}

_refreshAuthToken:

private _refreshAuthToken() : Observable<object> {
    return this._getAuthToken(body, headers)
        .catch(err =>  {
            return Observable.throw('Error');
        }) 
        .flatMap(data => {
            latestRefreshToken = data.refresh_token;
            body = "grant_type=refresh_token&refresh_token=" + latestRefreshToken;
            headers = new Headers('...');
            return this._getAuthToken(body, headers)
        })
}

_getAuthToken:

private _getAuthToken(body, headers) : Observable<object> {
    return this.http.post(this.restUrl + "/token", body, { headers: headers })
    .map(res => res.json())    
}

Answer 1

该函数应该 return Observable of boolean 但你 return

Observable<Observable<boolean>>

如果你在 jsbin 中这样做

Rx.Observable.of(1)
   .map(x=>Rx.Observable.of(true))
   .subscribe(x=>console.log(typeof x) // "object"

和

 Rx.Observable.of(1)
   .map(x=>true)
   .subscribe(x=>console.log(x) // "boolean"

因此您的代码应该：

 return this._refreshAuthToken()
    .map((data) => {
      //****IT GETS HERE, BUT DISPLAYS BLANK ****
      return true;
    })
    .catch(() => {
      return Observable.of(false);
    });

Angular2 Auth Guard 返回带有 Observable.of(true) 的空白页

Angular2 Auth Guard returning blank page with Observable.of(true)

angular2-routing

angular