Angular Http - 如何取消过时的请求

Question

所以基本上我有一个函数，每当我从 signalR 收到一个新数据时，它就会向服务器发出 2 个 HTTP 请求，这将被触发很多次。所以 getitemCount 函数会被调用那么多次。所以它也会多次命中服务器

getitemCount 是一个承诺，因为我使用 toPromise() 运算符将它从 Observable 转换。

我想做的是：当从服务器接收更新时，如果有任何 getitemCount 正在进行。它将被取消并提出新的请求。

export class LeftNavigationComponent implements OnInit, OnDestroy {
    typeACount: number = 0;
    typeBCount: number = 0;    

    constructor(
        private itemService: service.ItemService,        
        private signalR: service.SignalRService) { }

    ngOnInit(): void {
        this.subscriptions = [            
            this.signalR.itemCreated.subscribe(item => this.onUpdatingData()),
            this.signalR.itemUpdated.subscribe(item => this.onUpdatingData()),
            this.signalR.itemDeleted.subscribe(itemId => this.onUpdatingData())]
    }

    onUpdatingData() {
        Promise.all([
            this.itemService.getitemCount(APP_SETTING.TYPE_A),
            this.itemService.getitemCount(APP_SETTING.TYPE_B)])
            .then(response => this.gettingCountDone(response))
    }

    gettingCountDone(response) {
        this.typeACount = <any>response[0];
        this.typeBCount = <any>response[1];        
    }
}

我以前使用switchMap实现搜索，但仍然无法在当前用例中将其存档。

任何人都可以给我一个建议。到目前为止我所做的是使用 Observable 而不是 Promise 并使用 folkJoin 来合并结果。但它的行为与我现在所拥有的一样。

onUpdatingData() {
    Rx.Observable.forkJoin(this.itemService.getitemCount(APP_SETTING.TYPE_A), this.itemService.getitemCount(APP_SETTING.TYPE_B), (r1, r2) => {

    })
}

Answer 1

我只是在本地尝试，是的，取消订阅就可以了

const subscription = this.http.get(`/api/v2/url`).subscribe();
subscription.unsubscribe();

而且我看到请求已在 chrome

中取消

Angular Http - 如何取消过时的请求

Angular Http - How to cancel outdated request

angular-http

angular