source

Angular 2에서 HTTP 요청을 취소하는 방법은?

factcode 2023. 9. 11. 22:16
반응형

Angular 2에서 HTTP 요청을 취소하는 방법은?

Angular 2에서 HTTP 요청을 취소하는 방법은?

저는 요청 약속만 거절할 줄 압니다.

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);
            }
        );
});

다음과 같은 간단한 솔루션을 사용할 수 있습니다.

if ( this.subscription ) {
   this.subscription.unsubscribe();
}
this.subscription = this.http.get( 'awesomeApi' )
 .subscribe((res)=> {
  // your awesome code..
})

전화하셔도 됩니다.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();

자세한 정보는 여기: http://www.syntaxsuccess.com/viewarticle/angular-2.0-and-http

이전 요청의 응답을 취소하고 최신 요청만 요청하는 관찰 대상에서 SwitchMap을 사용할 수 있습니다.

https://www.learnrxjs.io/operators/transformation/switchmap.html

파티에 좀 늦었지만, 제 의견은 이렇습니다.

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')
  }
}

이렇게 하면 수동으로 요청을 취소할 수 있습니다.저는 때때로 페이지의 결과를 변경할 수 있는 관찰 가능한 또는 약속을 하게 됩니다.요청이 자동으로 시작된 경우(사용자가 x밀리에 대해 필드에 아무 것도 입력하지 않은 경우) 요청을 중단할 수 있는 것이 좋습니다(사용자가 갑자기 무언가를 다시 입력합니다).

takeTill은 또한 간단한 시간 초과(Observable.timer)와 함께 작동해야 합니다. 만약 그것이 당신이 https://www.learnrxjs.io/learn-rxjs/operators/filtering/takeuntil 을 찾고 있는 것이라면.

사용하다switchMap 모든 기내 요청을 취소하고 최신 정보만 사용합니다.

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는 늦은 구독자에 대해 최신 값을 표시합니다.

이것은 훌륭한 스레드이며, 제가 제공해야 할 정보가 조금 더 있습니다.아주 오랫동안 지속될 가능성이 있는 API 호출이 있습니다.그래서 타임아웃으로 취소하려면 이전 요청이 필요했습니다.오늘 막 알아냈어요, 제가 추가할 수 있는 건timeout연산자를 파이프 함수에 연결합니다.시간 초과가 카운트를 완료하면 이전 HTTP 요청이 취소됩니다.

예제...

return this.exampleHttpRequest()
  .pipe(
    timeout(3000),
    catchError(err => console.log(error)
)

언급URL : https://stackoverflow.com/questions/36490926/how-to-cancel-a-httprequest-in-angular-2

반응형