在Angular中,拦截器可以在HTTP请求数据响应之前进行最后处理。以下是一个使用拦截器处理HTTP请求和响应的示例代码:
首先,创建一个名为interceptor.service.ts
的拦截器服务:
import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from '@angular/common/http';
import { Observable } from 'rxjs';
@Injectable()
export class MyInterceptor implements HttpInterceptor {
intercept(request: HttpRequest, next: HttpHandler): Observable> {
// 在请求之前进行处理
console.log('Before request');
// 添加自定义请求头或其他处理逻辑
request = request.clone({
setHeaders: {
Authorization: 'Bearer token'
}
});
// 继续请求
return next.handle(request).pipe(
// 在响应之后进行处理
tap(event => {
if (event.type === HttpEventType.Response) {
console.log('After response');
// 处理响应数据
}
})
);
}
}
接下来,在你的模块文件中,注册拦截器服务:
import { NgModule } from '@angular/core';
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { MyInterceptor } from './interceptor.service';
@NgModule({
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: MyInterceptor,
multi: true
}
]
})
export class AppModule { }
现在,每当发出HTTP请求时,拦截器都会在请求之前进行处理,并在响应之后进行处理。你可以根据需要添加自定义请求头、修改请求参数等。