根据前一个请求的角度执行http请求2

我想在Angular 2中使用Observable时处理异步流。详细地说，在每个用户请求之前，我需要获取服务票证，如果该票证是有效的，用户可以得到适当的回应。因此，在实际请求之前，我必须先执行http请求，如下所示，我调用getServiceTicket（）方法，但是，由于异步流，在获取有效的服务票据之前，会执行以下http请求（getDetail）有效的服务票据。所以我尝试使用像isServiceTicket这样的标志，但我意识到它并不能保证这两种方法的顺序运行。我试图做一些研究，但我找不到满意的答案。如果有人有这个好的解决方案，你可以给一些建议吗？根据前一个请求的角度执行http请求2

getServiceTicket() { 
    this.userAuthServie.getServiceTicket().subscribe(
     (data: string) => {this.serviceTicket = data; this.isServiceTicket = true;} 
    ); 
} 

getDetail(id: string) { 
    this.getServiceTicket(); 
    return this.http.get('https://localhost/detail/' + id + '?ticket=' + this.serviceTicket) 
    .map((responseData) => { 
     return <User>responseData.json(); 
    } 
    ); 
}

来源

2016-12-07 Anna Lee

也许您正在寻找这样的：https://coryrylan.com/blog/angular-multiple-http-requests-with-rxjs – Ploppy

您可以更改侑代码象下面这样：

user:User; 

     getDetail(id: string) { 

     this.userAuthServie.getServiceTicket() 
      .subscribe((data: string) => { 
      this.serviceTicket = data; 
      this.isServiceTicket = true; 
      this.http.get('https://localhost/detail/' + id + '?ticket=' + this.serviceTicket) 
       .map((responseData) => { 
       this.user= <User>responseData.json(); 
       }); 
      }); 

     }

来源

2016-12-07 15:15:43

如果我这样做的方式，我得到“无法读取属性“订阅“未定义”。 –

在UserAuthService中提供代码getServiceTicket –

非常感谢。以下是来自UserAuthService的getServiceTicket。 getServiceTicket（）{ let cuser = JSON.parse（localStorage.getItem（'cUser'））; let creds =“servicename = http：//xxx.xxx.xxx”; let headers = new Headers（）; headers.append（'Content-Type'，'application/x-www-form-urlencoded'）; （cuser.token）{this.ttl.post（'https：// localhost/serviceTicket /'+ cuser.token +'？serviceName = http：//xxx.xxx.xxx'，creds，{ ） .map（res => res.json（）） } } –

您可以将要在第一个函数的订阅方法的成功一部分运行的第二功能。

getServiceTicket() { 
    this.userAuthServie.getServiceTicket().subscribe(
     (data: string) => { 
      this.serviceTicket = data; this.isServiceTicket = true; 
      this.getDetail(id); 
     } 
    ); 
}

来源

2016-12-07 15:27:54 Arash

非常感谢您的回答。我还有一个问题，我之所以实现这种方式，是因为我想实现分别获取服务票据的方法，这意味着每当我需要服务票据时，我想在实际的http请求之前调用该方法并获得服务并将该服务票据传递给真实的http请求方法。如果我以这种方式实施，我必须重复以下代码。 “this.userAuthServie.getServiceTicket（）。subscribe（”so ... –

你可以有两个单独的方法来执行此操作，或者只需在同一个方法中执行if语句即可执行或不执行所引用的部分 – Arash

如果你想等待服务票证被加载执行任何“具体要求”之前，您应该等待服务票据的响应来解决。有多种方式，一种方式可能是将细节添加到队列中，或者getDetails等待直到加载服务票证。

getServiceTicket() { 
    // you need to return the observable from service ticket 
    return this.userAuthServie 
     .getServiceTicket() 
     // use map here to only intercept the value. 
     // remember that you need to subscribe somewhere else 
     // if called from elsewhere than getDetail 
     .map((data: string) => { 
      this.serviceTicket = data; 
      this.isServiceTicket = true; 
      return data; 
     }); 
} 

getDetail(id: string) { 
    return this.getServiceTicket() 
     // we switch the observable from ticket to the one from detail using switchMap 
     .switchMap((data: string) => { 
      let url = 'https://localhost/detail/' + id + '?ticket=' + this.serviceTicket; 
      return this.http 
       .get(url) 
       .map((responseData) => { 
        return <User>responseData.json(); 
       }); 
     }); 
    } 
}

来源

2016-12-07 16:46:55 Patrick

非常感谢，但是我得到这个“Property'switchMap'不存在于类型'Observable '。如果你有一些线索，请给我一些解释吗？ –

工作非常好吧，非常感谢你！ –

switchMap有什么问题？ – Patrick

根据前一个请求的角度执行http请求2

回答

相关问题