实现canActivate auth guard in angular

时间:2018-06-06 09:54:18

标签: javascript angular canactivate

我有一个使用此函数的服务,返回true或false而不是令牌有效

loggedIn() {
return this.http.get('http://localhost:3000/users/validateToken')
  .map(res => res.json()).map(data => data.success);
}

我有一个auth guard可以在使用它的受保护路由上激活。

  canActivate(){
    this.authService.loggedIn().subscribe(res => {
      if(res) {
        return true;
      }
      else {
        this.router.navigate(['/login'])
        return false;
      }
    })
  }

但我得到了这个错误。

  

错误地实现了界面' CanActivate'。财产类型   ' canActivate'是不相容的。       输入'()=>空隙'不能分配类型'(route:ActivatedRouteSnapshot,state:RouterStateSnapshot)=>布尔值|   承诺| ...安装前后&#39 ;.         键入' void'不能赋值为' boolean |承诺|可观察到的'

我如何实现我在这里尝试做的事情?

1 个答案:

答案 0 :(得分:0)

canActivate函数必须返回布尔值,布尔值的承诺或布尔值的可观察值。

在你的情况下,你什么都不返回。可能是因为你在函数中省略了return

但是如果你添加它就行不通,因为那时你会返回一个签名不接受的订阅。

你能做的是:

canActivate() {
  return this.authService.loggedIn().map(res => {
    if(!res) {
      this.router.navigate(['/login']);
    }
    return res;
  });
}

使用此代码,您遵守签名,并保留路由逻辑。