Question

我对Angular 4和Observables以及与之相关的一切都是新手。我试图一个接一个地执行两个http请求（只有第一个成功时）。

我正在使用此代码：

public getCompany(id: string): any {
    let company = null;

    this.authService.isValidUser().subscribe(response => {
      const token = this.tokenStorageService.getTokenFromStorage();
      const requestUrl = environment.gatewayUrl + environment.companyService + environment.getCompanyEndPoint + id;
      const headers = new Headers();
      headers.set('Authorization', 'Bearer ' + token);
      const options = new RequestOptions({headers: headers});

      return this.http.get(requestUrl, options).catch(this.errorService.handleError);

    }, (error: AppError) => {
       // ........ //
    });
  }

这是isValidUser()方法代码：

  public isValidUser(): any {
    const token = this.tokeStorageService.getTokenFromStorage();
    if (!token) {
      console.log('cannot find token');
      return false;
    }

    const requestUrl = environment.gatewayUrl + environment.authorizationService + environment.userServiceEndPoint;
    const headers = new Headers();
    headers.set('Authorization', 'Bearer ' + token);
    const options = new RequestOptions({headers: headers});

    return this.http.get(requestUrl, options).catch(this.errorService.handleError);
  }

这里的想法是仅在return this.http.get(requestUrl, options).catch(this.errorService.handleError);代码工作后返回authService.isValidUser()。

我认为这不是执行此类请求的正确方法，因为我的第二个请求已在第一个请求之前完成。

也许我错过了一些如何正确地做到这一点？

谢谢。

Answer 1

您尝试将这两个函数链接起来的代码在哪里？

您可以使用switchMap运算符实现所需目标。这是docs。

我认为你需要这样的东西：

isValidUser()
  .filter(isValidUser => isValidUser) // <-- perhaps you need this filter since you want to make getCompany call only if user is valid
  .switchMap(() => getCompany())
  .subscribe(...do something...);

不要忘记添加import 'rxjs/add/operator/switchMap';。您也可以使用mergeMap或flatMap（mergeMap是flatMap的synonim，但不是首选。

@BeetleJuice在评论中提到：为什么switchMap更好？例如，您使用mergeMap或flatMap，导致另一个代码调用。即使两个第一次请求没有完成，也会发送新的请求。甚至可能第二捆请求的完成速度比第一捆更快。在第一个包完成后，您的状态中有错误的数据。为了解决这个问题，RxJS提供了完美的运算符switchMap。如果您在上述情况下使用此运算符，则将取消第一个可观察（第一个请求包）。只有最后一次观察（从最后一次通话）才能保持活力。只有在短时间内可以多次运行该代码时才需要switchMap。如果您知道此代码只会在mergeMap / flatMap为您执行此操作后运行。

另外，请查看this post。

Angular（4）：使用Observables的多个HTTP请求：一个接一个地成功

1 个答案: