Angular: How to know if request has been cancelled in HttpClient

∥☆過路亽.° 提交于 2019-11-30 10:06:49

I have also had this problem and that's a solution to which I've came recently:

to know if a request was cancelled you can use finally operator, heres example:

let cancelled = true;
return next.handle(request).do(
  undefined,
  () => {
    // error
    cancelled = false;
  },
  () => {
    // completed
    cancelled = false;
  },
).finally(
  () => {
    if (cancelled) {
      // do things
    }
  },
);

Finally I found a solution

intercept(httpRequest: HttpRequest<any>, httpHandler: HttpHandler):
    Observable<HttpEvent<any>> {

        this.requestsPending++;

        //...

        return new Observable(observer => {
            let sub = httpHandler.handle(httpRequest)
                .pipe(tap(event => {
                    //... your logic
                }))
                .subscribe(event => observer.next(event));

            return () => {
                if (!sub.closed) {
                    this.requestsPending--;
                    sub.unsubscribe();
                }
            };
        });
}

to make it work, I used a mix of both techniques from above as they did not work out of the box for me. Here my working code:

// your increment logic here

return new Observable(observer => {
  let isCanceled = true;   << here
  const sub = next.handle(req)
    .pipe(
      tap(
       (rsp: HttpResponse<any>) => {
          if (rsp.type === HttpEventType.Response) {
            isCanceled = false;
            // your decrement logic here
          }
        },
        (rspError: HttpErrorResponse) => {
          isCanceled = false;
          // your decrement logic here
          throwError(rspError); // re-throw same e
        },
      ),
    )
    .subscribe(observer);  // << here

  return () => {
    if (isCanceled) {
      // your decrement logic here
      sub.unsubscribe();
    }
  };
});

It seems like angular ignores the abort event. Here is the Angular sources: https://github.com/angular/angular/blob/5.0.1/packages/common/http/src/xhr.ts

The returned Observable does notifiy subscribers if the request is aborted.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!