Angular 2 - 在POST之前在HttpInterceptor中取消挂起的GET请求

时间:2017-11-02 20:34:01

标签: angular angular-http-interceptors

定期查询我的API的GET请求。如果我在GET请求挂起时发出POST请求,并且POST返回新数据,那么GET请求中的数据将会过时。

使用HttpInterceptor我可以在发送POST之前取消所有挂起的GET请求吗?

我被告知我可能无法将req传递给next.handle()但我应该通过的req是什么时候?

1 个答案:

答案 0 :(得分:2)

如果我们谈论Angular 2,您可能会以下一种方式调用您的API:

this.http.get('url').map(res => { ... }).catch(error => { ... });

它返回Observable,一旦你订阅它,它就会返回一个订阅。取消订阅后 - 它将取消您的请求。请参阅完整示例:

<强> service.ts

getData(): Observable<any> {
    return this.http.get('url').map(res => { ... }).catch(error => { ... });
}

<强> component.ts

requestSubscription: Subscription;

ngOnInit() {
   this.requestSubscription = this.service.getData().subscribe(data => { ... });
}

someFuncWhereYouHandlePOSTSuccess() {
   if (this.requestSubscription) {
      this.requestSubscription.unsubscribe();
   }
}

希望这个概念足够清晰。如果没有 - 我已准备好回答你的问题了。

修改

由于OP让我走上了正确的道路,我认为我的解决方案属于他的建议旁边的正确答案。

解决方案service.ts

private breakPolling: boolean = false;

constructor(private httpClient: HttpClient) {
}

getData() {
    return this.httpClient
        .get(this.url)
        .map((response) => {
            if (this.breakPolling) {
                this.breakPolling = false;
                return Observable.empty();
            } else {
                return response;
            }
        });
}

breakPolling() {
    this.breakPolling = true;
    return Observable.empty();
}

我发出一个动作,调用breakPolling()方法并设置一个简单的bool。我没有将响应数据作为可观察对象返回,而是返回一个空的Observable。

它不会取消请求,但会阻止其数据传递。它的丑陋,但它会补丁。