优雅的中间件,用于处理Angular 5.2.9中的HTTP响应

时间:2018-05-20 14:14:11

标签: angular typescript

我需要以同样的方式处理许多HTTP响应, 在不同的类和文件中,这是令人沮丧的。 所以我想知道我是否可以自定义HttpClient 并使这样的中间件处理如下任务:

this.http.get<any>('/api/ping/').subscribe((response) => {
  if (response.status_code == 302) {
    this.router.navigate([ response.data.redirectUrl ]);
  }
});

我决定使用Proxy对象, 但是只有我{4}} 尚未在TypeScript 2.5.3中实现。

请提前告诉我自定义Proxy行为的方法或TypeScript 2.5.3中代理对象的解决方法。

1 个答案:

答案 0 :(得分:2)

Thøs与TypeScript版本无关。代理是ES6功能,无法转换或填充。如果项目配置了ES5目标,则无法使用Proxy

这可以通过重用服务类中的公共代码来实现,因为它们通常用于执行API请求。

如果应该对所有请求进行此操作,这可能是也可能不合适,因为这也会影响第三方代码,可以使用拦截器:

@Injectable()
export class RedirectInterceptor implements HttpInterceptor {
  constructor(protected router: Router) {}

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(req).do((response) => {
      if (response.status_code == 302 && response.data.redirectUrl) {
        this.router.navigate([response.data.redirectUrl]);
      }
    });
  }
}

  ...
  providers: [
    [{ provide: HTTP_INTERCEPTORS, useClass: RedirectInterceptor, multi: true }],
  ],  
  ...