关于 angular:auth guard with firebase sdk

auth guard with firebase sdk

我尝试检查当前用户是否存在(登录)并将其返回到身份验证守卫中。

1
2
3
4
5
6
7
8
  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
    firebase.auth().onAuthStateChanged((user: firebase.User) => {
      if (user) {
        return true;
      }
      return false;
    });
  }

但是我得到了这个错误:

A function whose declared type is neither 'void' nor 'any' must return
a value.

看起来返回语句没有链接到 canActivate 函数。


canActivate 方法应该返回 Observable<boolean> | Promise<boolean> | boolean
您应该从 onAuthStateChanged 回调创建一个Promise或可观察的:

1
2
3
4
5
6
7
8
9
10
11
12
13
 canActivate(next: ActivatedRouteSnapshot,
              state: RouterStateSnapshot): Observable<boolean> | Promise<boolean> | boolean {
    return new Promise((resolve, reject) => {
      firebase.auth().onAuthStateChanged((user: firebase.User) => {
        if (user) {
          resolve(true);
        } else {
          this.router.navigate([ '/login' ], { queryParams: { returnUrl: state.url } });
          resolve(false);
        }
      });
    });
  }

因为你的保护 canActivate 方法返回类型是布尔值,你没有返回任何你得到错??误的东西。

您可以返回一个布尔值来解决此问题。但在您的情况下,我可以看到您的返回类型将是可观察的,并且在您想要返回 true 或 false 的可观察对象内。

所以你改变你的守卫t。

你需要做以下两件事

1
2
3
4
5
6
7
8
  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): : boolean | Observable<boolean> | Promise<boolean> {
     return firebase.auth().onAuthStateChanged((user: firebase.User) => {
      if (user) {
        return true;
      }
      return false;
    });
  }

您需要检查 firebase.auth().onAuthStateChanged() 的返回类型是什么,通常这些方法返回 observable。如果是这种情况,那么您需要将其更改为如下

1
2
3
4
5
6
7
8
  canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): : boolean | Observable<boolean> | Promise<boolean> {
     return firebase.auth().onAuthStateChanged().map((user: firebase.User) => {
      if (user) {
        return true;
      }
      return false;
    });
  }