[英]How to cancel a HTTPRequest in Angular 2?
How to cancel a HTTPRequest in Angular 2?如何在 Angular 2 中取消 HTTPRequest?
I know how to reject the request promise only.我只知道如何拒绝请求承诺。
return new Promise((resolve, reject) => {
this.currentLoading.set(url, {resolve, reject});
this.http.get(url, {headers: reqHeaders})
.subscribe(
(res) => {
res = res.json();
this.currentLoading.delete(url);
this.cache.set(url, res);
resolve(res);
}
);
});
You can use the following simple solution:您可以使用以下简单的解决方案:
if ( this.subscription ) {
this.subscription.unsubscribe();
}
this.subscription = this.http.get( 'awesomeApi' )
.subscribe((res)=> {
// your awesome code..
})
You can call unsubscribe
你可以打电话unsubscribe
let sub = this.http.get(url, {headers: reqHeaders})
.subscribe(
(res) => {
res = res.json();
this.currentLoading.delete(url);
this.cache.set(url, res);
resolve(res);
}
);
sub.unsubscribe();
More info here: http://www.syntaxsuccess.com/viewarticle/angular-2.0-and-http更多信息在这里: http ://www.syntaxsuccess.com/viewarticle/angular-2.0-and-http
You can use SwitchMap on the observable which will cancel any previous request's responses and only request the latest:您可以在 observable 上使用 SwitchMap ,它将取消任何先前请求的响应,并且只请求最新的:
https://www.learnrxjs.io/operators/transformation/switchmap.html https://www.learnrxjs.io/operators/transformation/switchmap.html
A little late for the party, but here is my take:聚会有点晚了,但这是我的看法:
import { Injectable } from '@angular/core'
import { Http } from '@angular/http'
import { Observable } from 'rxjs/Observable'
import { Subscriber } from 'rxjs/Subscriber'
@Injectable ()
export class SomeHttpServiceService {
private subscriber: Subscriber<any>
constructor(private http: Http){ }
public cancelableRequest() {
let o = new Observable(obs => subscriber = obs)
return this.http.get('someurl').takeUntil(o)
.toPromise() //I dont like observables
.then(res => {
o.unsubscribe
return res
})
}
public cancelRequest() {
subscriber.error('whatever')
}
}
This allows you to manually cancel a request.这允许您手动取消请求。 I sometimes end up with an observable or promise that will make changes to a result on the page.我有时会得到一个 observable 或 promise 来改变页面上的结果。 If the request was initiated automatically (user didn't type anyting in a field for x millis) being able to abort the request is nice (user is suddenly typing something again)...如果请求是自动启动的(用户没有在 x 毫秒的字段中输入任何内容)能够中止请求是很好的(用户突然再次输入内容)......
takeUntil should also work with a simple timeout (Observable.timer) if that is what you are looking for https://www.learnrxjs.io/learn-rxjs/operators/filtering/takeuntil takeUntil 也应该使用简单的超时(Observable.timer),如果这是您正在寻找的https://www.learnrxjs.io/learn-rxjs/operators/filtering/takeuntil
Use switchMap
[docs] , which will cancel all in-flight requests and use only the latest.使用switchMap
[docs] ,它将取消所有正在进行的请求并仅使用最新的。
get(endpoint: string): Observable<any> {
const headers: Observable<{url: string, headers: HttpHeaders}> = this.getConfig();
return headers.pipe(
switchMap(obj => this.http.get(`${obj.url}${endpoint}`, { headers: obj.headers, params: params }) ),
shareReplay(1)
);
}
shareReplay will emit the latest value for any late subscribers. shareReplay将为任何迟到的订阅者发出最新的值。
This is a great thread, and I have a little more info to provide.这是一个很棒的线程,我还有更多信息要提供。 I have an API call that could potentially go on for a very long time.我有一个可能会持续很长时间的 API 调用。 So I needed the previous request to cancel with a timeout.所以我需要前一个请求以超时取消。 I just figured out today that I can add a timeout
operator to the pipe function.我今天才发现我可以在管道函数中添加一个timeout
运算符。 Once the timeout completes its count, that will cancel the previous HTTP request.一旦超时完成其计数,这将取消先前的 HTTP 请求。
Example...例子...
return this.exampleHttpRequest()
.pipe(
timeout(3000),
catchError(err => console.log(error)
)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.