1.@core/interceptors/AuthInterceptor.ts

import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { TokenService } from '@services/token.service';

// 为什么加入 Injectable 装饰器, 因为该类采用了 tokenService 依赖注入服务
@Injectable()
export class AuthInterceptor implements HttpInterceptor {
    constructor(private tokenService: TokenService) {}

    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        const authToken = this.tokenService.getAuthToken();
        if (authToken) {
            const tokenReq = req.clone({ setHeaders: { authToken } });

            return next.handle(tokenReq);
        }
        return next.handle(req);
    }
}

2.@core/interceptors/index.ts

import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { AuthInterceptor } from './AuthInterceptor';

// 拦截器顺序不可随便变动
export const httpInterceptorProviders = [
    { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true }, //这个对象是要被依赖的
];

这段代码是一个 Angular HTTP 拦截器 (HttpInterceptor)，用于在发送 HTTP 请求时拦截请求并对其进行处理。拦截器可以用来修改请求、添加请求头、处理错误等。

让我们一步步解释代码的含义：

1. 导入模块和类:

   import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
   import { Injectable } from '@angular/core';
   import { Observable } from 'rxjs';
   import { TokenService } from '@services/token.service';

   这里首先导入了需要用到的 Angular HTTP 相关模块和类，以及依赖注入服务 TokenService。

2. @Injectable 装饰器:

   @Injectable()

   在 Angular 中，@Injectable() 装饰器用于标识该类是一个可被注入的依赖。由于 AuthInterceptor 类依赖于 TokenService，需要使用 @Injectable() 装饰器以便能够将 TokenService 注入到该类中。——> 依赖注入的应用

3. AuthInterceptor 类:

   export class AuthInterceptor implements HttpInterceptor {
       constructor(private tokenService: TokenService) {}
   
       intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
           const authToken = this.tokenService.getAuthToken();
           if (authToken) {
               const tokenReq = req.clone({ setHeaders: { authToken } });
               return next.handle(tokenReq);
           }
           return next.handle(req);
       }
   }

   • AuthInterceptor 类实现了 HttpInterceptor 接口，这意味着它需要实现 intercept 方法，该方法会在每个 HTTP 请求被发出时被调用。
   • intercept 方法接受两个参数：req 是要拦截的原始 HTTP 请求，next 是一个 HttpHandler，它可以处理修改后的请求并将其传递给下一个拦截器或最终的 HTTP 处理程序。
   • 在 intercept 方法内部，首先通过 tokenService.getAuthToken() 获取认证令牌。
   • 如果存在认证令牌 (authToken)，则通过 req.clone 创建一个新的请求 tokenReq，该请求在头部设置了认证令牌，然后将新请求传递给下一个处理程序。
   • 如果没有认证令牌，直接将原始请求 (req) 传递给下一个处理程序。

总的来说，这段代码定义了一个 HTTP 拦截器 (AuthInterceptor)，用于在 HTTP 请求中添加认证令牌头部，以确保请求携带了合适的身份验证信息。这样可以保证发送的请求在需要认证的情况下能够通过身份验证。

在app中使用：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { SharedModule } from '@shared';
import { httpInterceptorProviders } from '@core/interceptors';
import { AppComponent } from './app.component';
import { RouterRoutingModule } from './router/router-routing.module';
// 国际化相关
import { NZ_I18N, I18NSERVICE_MODULES, DEFAULT_LOCALE } from './core/locale/i18n-locale';
// 拦截器

@NgModule({
    declarations: [AppComponent],
    imports: [
        BrowserModule,
        FormsModule,
        RouterRoutingModule,
        HttpClientModule,
        BrowserAnimationsModule,
        SharedModule,
        ...I18NSERVICE_MODULES,
    ],
    providers: [...httpInterceptorProviders, { provide: NZ_I18N, useValue: DEFAULT_LOCALE.langId }], //这里声明依赖请求拦截器
    bootstrap: [AppComponent],
})
export class AppModule {}