Angular2 authguards 执行异步函数失败

Question

我想通过检查用户是否从服务器登录但异步函数未执行来保护我的路由

这是我的代码:

canActivate (route: ActivatedRouteSnapshot , state: RouterStateSnapshot): Observable<any> {
  let permission = route.data[ "permission" ]; //permissions are set on the routes
   if(permission){
       ..execute another function which works
    )
  }else{
    return this.checkLogin()  //this one is the one that fails
  }
}

关于函数checkLogin:

checkLogin (url?: string): any {
  this.authService.checkLoggedin()
    .subscribe(
      res=>{
       if(res){
         return true;
       }else{
          this.router.navigate ( [ '/login' ] );
          return false
       }

    }
  )
}

现在在auth服务上

checkLoggedin():Observable<any> {
//check from server if user is loggdin
  return this._httpclient.get(this.authurl + "/default/is-loggedin")
    .map(res => {

        return res.json().data;
    },error=>{
      return Observable.of(false);
      }
    );
}

我哪里出错了？

Answer 1

checkLogin必须返回 Observable<boolean>或 Promise<boolean> (或者一个普通的 boolean 如果它是同步的)。您没有返回任何东西。

试试这个。而不是 subscribe只需使用 map修改 checkLoggedin() 发出的值然后返回 Observable使用适当的 bool 值。

checkLogin (url?: string): Observable<boolean> {
    return this.authService.checkLoggedin()
    .map(
      res=>{
       if(res){
         return true;
       }else{
          this.router.navigate ( [ '/login' ] );
          return false
       }
    });
}

一个好的提示可能是永远不要将函数声明为返回 any ，始终将其声明为您要返回的实际类型，然后编译器可以完成它的工作，并在您实际需要返回结果时告诉您是否忘记返回结果。

同样checkLoggedin():Observable<any>应该是 checkLoggedin():Observable<boolean>以最大限度地提高捕获错误的机会(您可能必须对 json 数据进行一些转换才能使其正常工作)。