diff --git a/docs/en/CSRF-Anti-Forgery.md b/docs/en/CSRF-Anti-Forgery.md index fb091af9c7..8d8682ab69 100644 --- a/docs/en/CSRF-Anti-Forgery.md +++ b/docs/en/CSRF-Anti-Forgery.md @@ -31,6 +31,36 @@ ABP Framework also automates the following infrastructure; That's all. The systems works smoothly. +### Angular + +Angular supports CSRF Token out of box. It's default values are as follows: + +```json +{ + "cookieName": "XSRF-TOKEN", + "headerName": "X-XSRF-TOKEN" +} +``` + +The default configuration provided by Angular does not match ours. We have overriden these values with ours in `CoreModule` as follows: + +```typescript +@NgModule({ + // ... + imports: [ + BaseCoreModule, + //... + HttpClientXsrfModule.withOptions({ + cookieName: 'XSRF-TOKEN', + headerName: 'RequestVerificationToken' + }) + ], +}) +export class RootCoreModule {} +``` +If you use the ABP Framework with Angular as frontend, you should be already importing `CoreModule.forRoot` in your `AppModule`. +Therefore, this configuration will just work for you and you won't have to do anything. However, if you have different configuration (i.e. different `cookieName` or `headerName`), you can simply import `HttpClientXsrfModule.withOptions` in your `AppModule` with proper options. + ## Configuration / Customization ### AbpAntiForgeryOptions diff --git a/npm/ng-packs/packages/core/src/lib/core.module.ts b/npm/ng-packs/packages/core/src/lib/core.module.ts index 8cf9a90886..3756bff1bb 100644 --- a/npm/ng-packs/packages/core/src/lib/core.module.ts +++ b/npm/ng-packs/packages/core/src/lib/core.module.ts @@ -1,5 +1,5 @@ import { APP_BASE_HREF, CommonModule } from '@angular/common'; -import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http'; +import { HttpClientModule, HTTP_INTERCEPTORS, HttpClientXsrfModule } from '@angular/common/http'; import { APP_INITIALIZER, Injector, ModuleWithProviders, NgModule } from '@angular/core'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { RouterModule } from '@angular/router'; @@ -125,6 +125,10 @@ export class BaseCoreModule {} NgxsRouterPluginModule.forRoot(), NgxsStoragePluginModule.forRoot(), OAuthModule.forRoot(), + HttpClientXsrfModule.withOptions({ + cookieName: 'XSRF-TOKEN', + headerName: 'RequestVerificationToken', + }), ], }) export class RootCoreModule {}