在Angular中,为了提供XSRF(跨站请求伪造)/ CSRF(跨站请求伪造)保护,可以使用HttpClientXsrfModule
和HttpXsrfTokenExtractor
。如果xsrfTokenExtractor.getToken()
返回null,可能是由于以下原因之一:
HttpClientXsrfModule
:确保在应用的根模块中导入并配置HttpClientXsrfModule
。示例如下:import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule, HttpClientXsrfModule } from '@angular/common/http';
@NgModule({
imports: [
BrowserModule,
HttpClientModule,
HttpClientXsrfModule.withOptions({
cookieName: 'XSRF-TOKEN',
headerName: 'X-XSRF-TOKEN',
}),
],
declarations: [AppComponent],
bootstrap: [AppComponent]
})
export class AppModule { }
缺少XSRF令牌:确保服务器在响应中包含名为XSRF-TOKEN
的Cookie,并在每个请求的标头中包含名为X-XSRF-TOKEN
的标头。这可以通过在服务器的响应中设置相关标头来实现。
自定义HttpXsrfTokenExtractor
:如果需要自定义HttpXsrfTokenExtractor
,可以创建一个实现HttpXsrfTokenExtractor
接口的自定义类,并在HttpClientXsrfModule
配置中使用它。示例如下:
import { Injectable } from '@angular/core';
import { HttpXsrfTokenExtractor } from '@angular/common/http';
@Injectable()
export class CustomXsrfTokenExtractor implements HttpXsrfTokenExtractor {
getToken(): string | null {
// 自定义逻辑来提取XSRF令牌
return 'custom-xsrf-token';
}
}
然后,在HttpClientXsrfModule
配置中使用自定义的CustomXsrfTokenExtractor
类:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { HttpClientModule, HttpClientXsrfModule, HttpXsrfTokenExtractor } from '@angular/common/http';
import { CustomXsrfTokenExtractor } from './custom-xsrf-token-extractor';
@NgModule({
imports: [
BrowserModule,
HttpClientModule,
HttpClientXsrfModule.withOptions({
cookieName: 'XSRF-TOKEN',
headerName: 'X-XSRF-TOKEN',
}),
],
providers: [
{ provide: HttpXsrfTokenExtractor, useClass: CustomXsrfTokenExtractor }
],
declarations: [AppComponent],
bootstrap: [AppComponent]
})
export class AppModule { }
希望这些解决方法能帮助你解决xsrfTokenExtractor.getToken()
返回null的问题并实现XSRF/CSRF保护。