[Angular] 拦截器Interceptor更改http请求头信息

最新推荐文章于 2024-01-18 11:44:17 发布

掩郁

最新推荐文章于 2024-01-18 11:44:17 发布

阅读量806

点赞数

文章标签： angular javascript http

本文链接：https://blog.csdn.net/m0_60745105/article/details/125536148

版权

1.先建一个拦截器：

import { SessionStateService } from '@abp/ng.core';
import { HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root',
})
export class MyApiInterceptor implements HttpInterceptor {
  constructor(private sessionStateService: SessionStateService) {}
  intercept(request: HttpRequest<any>, next: HttpHandler) {
    const headers = request.headers.set('accept-language', this.sessionStateService.getLanguage());
    //const headers = request.headers.set('accept-language', 'zh-Hans');
    request = request.clone({ headers });
    return next.handle(request);
  }
}

2. 在App.Module.ts注入拦截器 MyApiInterceptor

import { MyApiInterceptor } from './http-interceptors/emr-api-interceptor';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';

registerLocaleData(zh);
export function storageFactory(): OAuthStorage {
  return sessionStorage;
}
@NgModule({
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    ErrorHandlerModule,
    HttpClientModule,
  ],
  declarations: [AppComponent],
  providers: [
    APP_ROUTE_PROVIDER,
    { provide: OAuthStorage, useFactory: storageFactory },
    {
      provide: HTTP_INTERCEPTORS,
      useClass: MyApiInterceptor,
      multi: true,
    },
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

从其他博客处贴图概念：(转)Angular中的拦截器Interceptor - 走看看