如何在攔截器中取消當前請求 - Angular 4

Question

如您所知，可以在新版本的 Angular 4 中使用攔截器。

在我的情況下，我想在某些情況下取消攔截器中的請求。 那么有可能嗎？ 或者我應該問的是，我應該以哪種方式做到這一點？

也會好的！ 如果我找到了一種方法來重寫對請求的一些響應而不是取消它。

Answer 1

我認為切斷攔截器鏈所需要做的就是簡單地返回一個空的Observable如下所示：

import { EMPTY } from 'rxjs';

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
  if (stopThisRequest) {
    return EMPTY;
  }

  return next.handle(request);
}

Answer 2

受@RVP 回答的啟發，我發現可以使用Observable.throw()以同樣簡單的方式切斷錯誤鏈

//...
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (stopThisRequestWithError) {
        return Observable.throw('Error message');
    } else {
        return next.handle(req);
    }
}

這避免了使用未定義的值來實現響應承諾。

Answer 3

這只是RVP答案的一個輕微變體

import { NEVER } from 'rxjs';

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
  if (stopThisRequest) {
    return NEVER;
  }

  return next.handle(request);
}

我使用NEVER而不是EMPTY來避免在我的訂閱（或承諾）中處理未定義的值。

如果您不希望調用訂閱回調，請使用NEVER

Answer 4

對於 Angular 6，您需要可以使用以下結構返回一個空的 Observable：

import {Observable} from 'rxjs';
import {empty} from 'rxjs/internal/Observer';

//...

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    if (stopThisRequest) {
        return Observable.create(empty);
    } else {
        return next.handle(req);
    }
}

Answer 5

@RVP 的代碼會起作用，我們可以為同樣的事情做多一件事。

僅添加return ，它也可以工作

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
          if(helper.isTokenExpired(tokenVal)){
              return;
          }
        .
        . <{code}>
        .

    }

Answer 6

如上所述，有更優化的方法來處理自定義響應的錯誤

import { throwError, Observable } from 'rxjs';
import { HttpEvent } from '@angular/common/http';

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
  if (authFailedDummy(request)) {
    return throwError(new Error('Authorization error: The request did not go through'));
  }
  return next.handle(request);
}

Answer 7

嘿，我想我遲到了，但想分享一些額外的知識

如果您想在某個超時后取消請求，您可以在攔截器中使用 rxjs 超時運算符，它適用於每個請求。

  intercept(req: HttpRequest<any>, next: HttpHandler):Observable<HttpEvent<unknown>> 
    {
    return next.handle(req).pipe(timeout(30000), 
    catchError((error: HttpErrorResponse) => {
      return throwError({ error: error.name, message: error.message});
    })) as Observable<HttpEvent<unknown>>
    }

Answer 8

let sub = this.http.get(url, {headers: reqHeaders})
            .subscribe(
                (res) => {
                    res = res.json();
                }
            );

sub.unsubscribe();