1

我正在尝试对我的一条路线实施身份验证保护，但我无法让它工作，因为我不确定如何使用 observable 来做到这一点。

我ngrx/store用来存储我的令牌，然后在我使用 获取它的守卫中this.store.select('auth')，它获取一个看起来像这样的对象（如果您已登录）：

{
  token: 'atokenstring',
  isAuthenticated: true,
  isPending: false
}

守卫看起来像这样：

export class AuthGuardService implements CanActivate {

  constructor(private router: Router, private store: Store<IStore>) {}

  canActivate(): Observable<any> {

    return this.store.select('auth').let((state: Observable<IAuthStorage>) => state.filter((auth: IAuthStorage) => !auth.isPending && auth.isAuthenticated)).map(
      (auth: IAuthStorage) => {

        if (!auth.isAuthenticated) {
          return this.router.navigateByUrl('admin/login');
        }
        else {
          return true;
        }
      }
    );
  }
}

现在，问题似乎是守卫返回一个可观察的而不是布尔值。即使您进入elsewhich 返回，这也会导致路线不呈现true。

我怎样才能使守卫返回布尔值而不是可观察值？

4

1 回答 1

1

不确定这是否仍然是这种情况，但不久前需要这样的东西

  canActivate(): Observable<any> {

    return this.store.select('auth').let((state: Observable<IAuthStorage>) => state.filter((auth: IAuthStorage) => !auth.isPending && auth.isAuthenticated)).map(
      (auth: IAuthStorage) => {

        if (!auth.isAuthenticated) {
          return this.router.navigateByUrl('admin/login');
        }
        else {
          return true;
        }
      }
    ).first(); // <<<=== added
  }

让路由器只等待一个事件，而不是让 observable 本身完成。

first需要导入才能使用。

于 2016-11-21T06:39:52.677 回答