Angular 4 GET 请求（可观察）

Question

我正在尝试在 Angular 4 项目中获得一个可观察对象\ 获取请求没问题，但是当我是管理员时，我被推到了 403 未经授权的页面，我试图理解这个问题，我调试了代码，但我无法理解，代码运行非常好，但我还是被推送到 403...

   isAdmin(): Observable<object> {
        if (!this._isAdmin) {
            this._isAdmin = this.http.get('./api/account/admin')
            .map(
        (res: Response) => res.json())
        .publishReplay(1)
        .refCount()
        .catch((error: any) => {
            this.router.navigate(['/error/403']);
            return Observable.throw(error.json().error || 'Server error');
        })      
    }
        if (!this._isAdmin) {
            this.router.navigate(['/error/403']);
            return Observable.throw('Server error');
        }        
        return this._isAdmin;
    }



   canActivate(
     next: ActivatedRouteSnapshot,
     state: RouterStateSnapshot): boolean {             
         console.log("check");
     const allowedRoles = next.data.permittedRoles as Array<string>;

        this.authService.isAdmin().subscribe(
            (data: any) => {
            if (!data) {
                this.router.navigate(['/error/403']);
                return false;
            }
            allowedRoles.forEach((element: any) => {
                if (data.RoleType === element) {         
         if (data.IsAdmin) {
                return true;
            }         
        }
    }),
    (err: any) =>         
    {
        console.log(err);
        this.router.navigate(['/error/403']);
        return false;
}});
this.router.navigate(['/error/403']);
       return false;
}
}

Answer 1

你需要 return 从你的警卫那里观察到，因为你不能从 subscribe return。此外，如果您正在使用 HttpClient，我希望您这样做，您不需要解析为 JSON，因为 HttpClient 会为您完成。如果您正在使用 Http，我强烈建议您继续使用 HttpClient。无论如何，假设您使用的是 HttpClient，您的代码应该如下所示：

isAdmin(): Observable<object> {
  return this.http.get('./api/account/admin')
}

和守卫（我通过将 subscribe 更改为 map 对 Norbert 的回答稍作修改）：

canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<boolean> {
  this.authService.isAdmin().map((data) => {
    if (data && data.isAdmin) {
      return true;
    }
    this.router.navigate(['/error/403']);
    return false;
  }
}

我省略了 forEach 循环，因为我没有看到它如何适合这里，因为您无论如何都在检查 data.isAdmin 是否存在。但是如果你出于某种原因需要它，我会建议一个 for 循环，forEach 不能 return 任何东西。您还需要将 truthy 或 falsy 值分配给变量，因为在 for 循环中 return 只会中断循环。

let bool = false;
for(let element of allowedRoles) {
  if (data.RoleType === element) {
    if (data.IsAdmin) {
      bool = true;
      return;
    } 
  }
}

if (bool) { return true }

Answer 2

好吧，几个月后我并没有意识到这一点，但我的 IIS 身份验证是匿名和 Windows 身份验证，我不得不删除匿名身份验证才能正常工作

Angular 4 GET 请求（可观察）

Angular 4 GET Request (Observable)

angular

canactivate