增加Angular 2+和ASP.NET Core WebAPI應用程序中的超時

Question

在我的Angular 2+ / ASP.NET Core MVC WebAPI應用程序中，我有一個從客戶端UI到服務器的長時間API調用。 請求在30秒后超時。 我想為客戶端或服務器端的特定API調用定義超時。

我只找到了全局配置服務器超時的方法，這不是我想要的，因為30秒超時適用於其他呼叫。 我還找到了通過管道RxJS的timeout運算符來減少超時客戶端的解決方案。 不過，據我所知，這是不適合在壓痕超時？

如何在此特定請求上設置超時？ 30秒默認來自哪里？

（代碼實際上並不重要，因為它是標准的API控制器和標准的Angular HTTP調用）：

this.http.get('api/xyz').subscribe(d => { ... });

Answer 1

要解決超時問題，您可以使用RxJs的timeout ，如下所示

將時間（以毫秒為單位）傳遞給timeout運算符

這里我作為超時傳遞60秒，所以60秒后如果沒有來自服務器的響應那么它將拋出超時錯誤。

import ‘rxjs/add/operator/timeout’; 

...

this.http.get('api/xyz').timeout(60000).subscribe(d => { ... });

Answer 2

看來，如果不擴展HttpClientModule類，攔截器與各個請求通信的唯一預期方式是params和headers對象。

由於超時值是標量，因此可以安全地將其作為自定義標頭提供給攔截器。

import { Inject, Injectable, InjectionToken } from '@angular/core';
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Observable } from 'rxjs';
import { timeout } from 'rxjs/operators';

export const DEFAULT_TIMEOUT = new InjectionToken<number>('defaultTimeout');

@Injectable()
export class TimeoutInterceptor implements HttpInterceptor {
  constructor(@Inject(DEFAULT_TIMEOUT) protected defaultTimeout: number) {
  }

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const timeoutValue = Number(req.headers.get('timeout')) || this.defaultTimeout;

    return next.handle(req).pipe(timeout(timeoutValue));
  }
}

這可以在您的應用模塊中配置，如：

...
providers: [
  [{ provide: HTTP_INTERCEPTORS, useClass: TimeoutInterceptor, multi: true }],
  [{ provide: DEFAULT_TIMEOUT, useValue: 30000 }]
],  
...

然后使用自定義超時標頭完成請求

http.get(..., { headers: new HttpHeaders({ timeout: `${20000}` }) });