Angular2中的响应拦截器答案

【问题标题】：Response Interceptor in Angular2Angular2中的响应拦截器
【发布时间】：2017-08-29 08:18:50
【问题描述】：

我向服务器发送了许多 HTTP 请求，服务器向每个请求返回一个带有新访问令牌的响应（可能在标头或正文中）。

有没有办法在完成之前或之后处理所有响应，例如某些后端框架中请求的中间件？

【问题讨论】：

标签： angular angular2-services angular-http

【解决方案1】：

如果您使用的是 Angular 4+，您可以查看HttpClientModule，它提供了对拦截器的支持。

例如

import { Observable } from 'rxjs';
import {Injectable} from '@angular/core';
import {HttpEvent, HttpInterceptor, HttpHandler, HttpRequest} from '@angular/common/http';
import { HttpErrorResponse } from "@angular/common/http";

@Injectable()
export class AngularInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(req).do(event => {}, err => {
        if(err instanceof HttpErrorResponse){
            console.log("Error Caught By Interceptor");
            //Observable.throw(err);
        }
    });
  }
}

注册到 app.module

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        HttpClientModule
    ],
    providers: [
        [ { provide: HTTP_INTERCEPTORS, useClass: 
              AngularInterceptor, multi: true } ]
    ],
    bootstrap: [AppComponent]
})
export class AppModule {
}

更多关于HttpClientModule

如果您不使用 angular v4，请在 SO link 上查看此答案

【讨论】：

【解决方案2】：

你可以使用http-interceptor包

包源ng-http-interceptor

它处理http的每个请求和响应

【讨论】：