angular - 使用 RxJS 从 HTTP 请求在 Angular 组件之间传递数据的正确方法是什么？

Question

我正在尝试为一个项目创建一个登录系统，我有一个身份验证服务、令牌服务和我的登录组件，我刚开始使用 RxJS，所以这很可能是一个非常愚蠢的问题。

我的设计是让令牌服务获取令牌并使用我的后端执行 HTTP 请求，将信息传递给 auth-service，这将确定用户是否成功登录，然后将其传递回 login-该组件将阻止允许用户进一步进入站点。

代码在我的令牌服务中是这样的：

getToken() : any {
   return this.http.get(this.SERVER.HREF + query, requestOptions).share();
}

makeRequest() : any {
   let obsv = getToken();
   obsv.subscribe((res: Response) =>) {
     let token = res.json().data.token;
     this.http.get(this.SERVER.HREF + query, requestOptions).share(); 
     // above is that Observable that returns the data that I would like to
     // pass back to auth-service
   }
}

auth-service 被注入到 login-component 中，token-service 被注入到 auth-service 中。如何获取我对身份验证服务的请求结果，以便它可以解析它并将布尔值返回给登录组件？

Answer 1

您的代币服务

getToken() : any {
   return this.http.get(this.SERVER.HREF + query, requestOptions);
}

makeRequest() : any {
  return this.getToken().switchMap(()=>{
     return this.http.get(this.SERVER.HREF + query, requestOptions)
});

}

您的身份验证服务，假设您将令牌服务注入为 _tokenService

this._tokenService.makeRequest().subscribe(console.log)