Question

我有一个应用程序可以发出3个HTTP请求，每个请求都依赖于其他请求的信息。目前我正在提出下一个成功请求，但效率低下。我做了一些研究，发现我想要使用flatmap，但我试过的几种方法都没有向api发出http请求

这是我尝试过的但却没有返回任何内容

return this.info.getLastRecord(this.station)
      .map((res: any) => res.json()
      .flatMap((info: any) => {
        return this.info.getQueue(this.lastID)
          .map((res: any) => {
            console.log(res.json());
          });
      }));

这不起作用

return this.info.getLastRecord(this.station)
    .map((res: any) => res.json()
    .flatMap((res: any) => {
    return this.info.getQueue(this.lastID)
        .map((res: any) => {
        console.log(res);
     });
   }));

这就是我正在进行通话的方式

this.getInfoService.getLastRecord(this.station)
  .subscribe(
    (info) => {
      console.log("res", info);
    },
    (error: Response) => console.log(error),
    () => this.getQueue()
  );

getQueue() {
  this.info.getQueue(this.lastID)
  .subscribe(
    (info) => {
      console.log("getQueue", info);
    },
    (error: Response) => console.log(error),
    () => this.gHTDG())
}

getHookTypeDieGroup() {
this.info.getHookTypeDieGroup(this.profileCode)
  .subscribe(
    (info) => {
      console.log("GHTDG", info);
    },
    (error: Response) => console.log(error)
  );
}

info.service.ts

getLastRecord(station: string): any {
return this.http.get('http://API.app/getLastRecord/' + station)
  .map(
    (response: Response) => {
      return response.json().info;
    },
  ).share();
}

getQueue(lastID: number): any {
return this.http.get('http://API.app/getQueue/' + lastID)
  .map(
    (response: Response) => {
      return response.json().info;
    }
  )
  .share();
}

gHTDG(pCode: string): any {
return this.http.get('http://API.app/getHTDG/' + pCode)
  .map(
    (response: Response) => {
      return response.json().info;
    }
  ).share();
}

Answer 1

如果你需要它们按顺序链接在一起，我认为switchMap是你想要的运算符。我很难跟踪你的逻辑，但我认为它看起来像这样：

this.getInfoService
    .getLastRecord(this.station)
    .switchMap(x => this.getQueue(x.(value from getLastRecord call)))
    .switchMap(x => this.getHookTypeDieGroup(x.(value from getQueue call))
    .subscribe(x => {  //Do something with final result });

每个switchMap都会订阅之前的observable并将其结果输入到fat arrow函数中，该函数将返回一个新的observable。订阅将是最终可观察的结果。

Example can be found here.

Answer 2

如果您想在连续完成后按特定顺序执行3个请求，我认为concatMap将成为您的运算符。敌人的例子：

getLastRecord(station: string): Observable<any> {
return this.http.get(`http://API.app/getLastRecord/${station}`)
  .map(response => response.json().info)
  .catch(//handle error);
}

getQueue(lastID: number): Observable<any> {
return this.http.get(`http://API.app/getQueue/${lastID}`)
  .map(r=> r.json().info)
  .catch(//handle error);
}

gHTDG(pCode: string): Observable<any> {
return this.http.get(`http://API.app/getHTDG/${pCode}`)
  .map(response => response.json().info);
  .catch(//handle error)
}

concatenatedRequest(station: string): Observable<any>{
  return this.getLastRecord(station)
.concatMap(lastRecord=> this.getQueue(lastRecord.id))//lastRecord is the result from the previous getLastRecord request
.concatMap(queueData => this.gHTDG(queueData.pCode))//queueData is the result of the previous getQueue request
.catch(//handle error);
}

我还没有尝试过，但根据应该有用的文档：D 有关运算符的详细信息，请检查以下link

如何正确平面映射三个HTTP请求

2 个答案: