Question

  const data = {
    authToken: `Bearer ${this.authToken}`
  }
  this.appService.getEphemeralKey(data)
    .subscribe((response) => {
      if (response) {
        console.log(response);
        this.customerId = response.associated_objects[0].id;
       // this.retrieveCard();
      } else if (response.message === 'Unauthenticated') {
        localStorage.removeItem('userInfo');
        this.router.navigate(['/']);
        this.toastrService.info('Other user login with this account');
      }
      else {
        console.log(response.message);
      }
    }, error => {
      console.log('some error occured');
    })
}

retrieveCard（）{

const data = {  
    authToken: `Bearer ${this.authToken}`,
    customerId: this.customerId
}
console.log(data);
this.appService.retrieveCard(data)
    .subscribe((response) => {
        if (response) {
             console.log(response.data);

            if(response.data.sources.data.length === 0){
                console.log("no card");
                this.subscribed=false;
            this.providerService.showSubscriptionButton();
            }else{
    console.log('yes card');
    this.subscribed=true;
        }

        } else if (response.message === 'Unauthenticated') {
            localStorage.removeItem('userInfo');
            this.router.navigate(['/']);
            this.toastrService.info('Other user login with this account');
        }
        else {
    console.log(response.message);
    this.subscribed=false;
        }
    }, error => {
  console.log('some error occured');
  this.subscribed=false;
    })

}

我希望在我的auth Guard中将这些调用链接两个。我如何创建涉及两个api调用的身份保护，并且在第二个api返回true之后返回true。如何做这个但它不适用于两个api调用。我的解决办法是这样

canActivate(route: ActivatedRouteSnapshot): Observable<boolean> {
    const data = {
      authToken: `Bearer ${this.authToken}`,
    }
    return this.appService.getEphemeralKey(data)
      .map((res) => {
        let customerId = res.associated_objects[0].id;
        let data1 = {
          authToken: `Bearer ${this.authToken}`,
          customerId: customerId
        }
        console.log(res)
        this.appService.retrieveCard(data1)
          .subscribe((res) => {
            console.log(res);
            if (res.data.sources.data.length === 0) {
              console.log("no card");
              this.subscribed = false;
              this.providerService.showSubscriptionButton();
            } else {
              console.log('yes card');
              this.subscribed = true;

            }
          })
        if (this.subscribed) {
          return true;
        }
        return false;
      })


  }

请让我知道我在这里做错了什么。我没有收到数据

Answer 1

您必须使用Rxjs概念（map和flatMap）这是rxjs Rxjs official docs

的官方文档

这是您必须使用的代码模式。

控制器代码

Submit() {
this.doAPICall().subscribe(res => {
 // write your logic.
})

}

服务代码

 public doAPICall() {
    this.getEphemeralKey.map(res => {
        return res;

    }).map(res1 => {
        this.retrieveCard.flatMap(res => {
            return Observable.of({
                res1: res1,
                res2: res
            });
        })
    })
}

    public getEphemeralKey(): Observable < any > {
        let data1 = {
            authToken: `Bearer ${this.authToken}`
        }
    return this.appService.getEphemeralKey(data1);
    }

    public retrieveCard(): Observable < any > {
        let  data2 = {
            authToken: `Bearer ${this.authToken}`,
            customerId: this.customerId
        }
    return this.appService.retrieveCard(data2);
    }

如何在角度6的守卫中依次运行两个api调用？

1 个答案: