ng 命令解析之interceptor(请求拦截)

最新推荐文章于 2024-08-12 14:19:51 发布

置顶

PrayerYa

最新推荐文章于 2024-08-12 14:19:51 发布

阅读量1k

点赞数

分类专栏： angular 文章标签： angular interceptor 请求拦截 http拦截器

本文链接：https://blog.csdn.net/Zhonghuachun/article/details/109356941

版权

本文介绍了如何在Angular中使用`ng g interceptor`命令创建HTTP请求拦截器，详细阐述了拦截器的工作原理，包括在`intercept`方法中如何修改请求和响应。拦截器可用于添加请求头（如token）以及处理特殊响应。实现拦截器需要实现`HttpInterceptor`接口，并在`app.module.ts`中进行提供以确保生效。拦截器的执行顺序与`providers`数组中的顺序一致，可以通过barrel文件来统一管理多个拦截器。

摘要由CSDN通过智能技术生成

ng g interceptor interceptorName 用于创建一个http请求拦截器，用于请求前的拦截(token添加)，响应后的拦截(特殊响应处理)等

要实现拦截器，就要实现一个实现了 HttpInterceptor 接口中的 intercept() 方法的类。

这里是一个什么也不做的空白拦截器，它只会不做任何修改的传递这个请求。（intercept 方法会把请求转换成一个最终返回 HTTP 响应体的 Observable）

//ng g interceptor interceptor/token
import { Injectable } from '@angular/core';
import {
  HttpRequest,
  HttpHandler,
  HttpEvent,
  HttpInterceptor
} from '@angular/common/http';
import { Observable } from 'rxjs';

@Injectable()
export class TokenInterceptor implements HttpInterceptor {

  constructor() {}

  intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
    return next.handle(request);
  }
}