CSRF Token Generation in Spring Boot
In Spring Boot (and Spring Security more generally), CSRF (Cross-Site Request
Forgery) tokens are generated and managed automatically by the framework
to protect against CSRF attacks.
When you include Spring Security in your Spring Boot project, CSRF protection
is enabled by default for web applications.
How CSRF Token is Generated
When a user accesses a secured web page:
Spring Security generates a unique CSRF token for the user session.
This token is associated with the user's HTTP session
(HttpSessionCsrfTokenRepository by default).
The token is typically generated using something like:
UUID.randomUUID().toString();
CSRF Token Repositories
Spring Security uses a CsrfTokenRepository to store and retrieve CSRF
tokens. Common implementations:
HttpSessionCsrfTokenRepository: stores token in the HTTP session
(default).
CookieCsrfTokenRepository: stores the CSRF token in a cookie (often
used for SPAs like Angular or React).
Example:
@Bean
SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
http
.csrf(csrf -> csrf
.csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())
);
return http.build();
}
4. CSRF Token in the HTML Page
If you use Thymeleaf or JSP, Spring can automatically include the CSRF token in
forms:
Example (Thymeleaf):
<form method="post" th:action="@{/submit}">
<input type="hidden" th:name="${_csrf.parameterName}" th:value="$
{_csrf.token}" />
...
</form>
For JavaScript-based clients (e.g., Angular, React), the token can be retrieved
from a cookie or an endpoint and sent via header.
CSRF Token Validation
When a POST, PUT, DELETE, or PATCH request is received:
Spring Security checks for the CSRF token in the request (header or form
field).
If the token is missing or invalid, a 403 Forbidden is returned.
Customizing or Disabling CSRF
You can disable CSRF protection (not recommended for browser-based clients):
http.csrf(csrf -> csrf.disable());
Or use it selectively for specific endpoints (e.g., enable it for web, disable it for
APIs).
Here's how it works:
Default CSRF Token Generation
1. Token Creation:
o Spring Security generates a random, cryptographically strong
token value
o By default, it uses SecureRandom to create a Base64-encoded string
o The token is typically 32-64 bytes long (exact length depends on
the implementation)
2. Token Storage:
o The token is stored in the HTTP session on the server side
o A copy is also sent to the client, typically in:
A hidden form field named _csrf (for form submissions)
Or as a header (for AJAX requests)
3. Token Validation:
o When a state-changing request (POST, PUT, DELETE, etc.) is made:
Spring Security compares the token from the request with
the one stored in the session
If they don't match, the request is rejected
Customization Options
You can customize CSRF token behavior in Spring Security:
@Configuration
@EnableWebSecurity
public class SecurityConfig {
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http)
throws Exception {
http
.csrf(csrf -> csrf
.csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse())
// or use custom token repository
// .csrfTokenRepository(new CustomTokenRepository())
);
return http.build();
}
}
Common Token Repository Implementations
1. HttpSessionCsrfTokenRepository (default):
o Stores tokens in the HTTP session
o Expects token in header or parameter named _csrf
2. CookieCsrfTokenRepository:
o Stores token in a cookie named XSRF-TOKEN
o Client reads cookie and sends token in header X-XSRF-TOKEN
Token Generation Process Details
The actual token generation happens in the CsrfToken interface
implementations. The default implementation:
1. Uses SecureRandom for cryptographically strong random numbers
2. Base64 encodes the random bytes
3. Creates a token with:
o A random value (the actual token string)
o A parameter name (default _csrf)
o A header name (default X-CSRF-TOKEN)
Example Flow
1. First GET request:
o Server generates token, stores in session
o Includes token in response (form field or header)
2. Subsequent POST request:
o Client includes token in request
o Server validates token against session-stored token
o If valid, processes request; if not, returns 403
This mechanism ensures that only requests originating from your own site can
perform state-changing operations.
Setting up CSRF protection in a Spring Boot backend with an Angular
frontend:
Spring Boot Configuration (Backend)
1. Basic Security Configuration:
@Configuration
@EnableWebSecurity
public class SecurityConfig {
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws
Exception {
http
.csrf(csrf -> csrf
.csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse()
)
.authorizeHttpRequests(auth -> auth
.requestMatchers("/api/**").authenticated()
.anyRequest().permitAll()
.formLogin(withDefaults())
.httpBasic(withDefaults());
return http.build();
2. CORS Configuration (for Angular dev server):
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurer() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("http://localhost:4200")
.allowedMethods("*")
.allowCredentials(true);
};
Angular Configuration (Frontend)
1. HttpInterceptor for CSRF:
// csrf.interceptor.ts
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from
'@angular/common/http';
import { Observable } from 'rxjs';
export class CsrfInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler):
Observable<HttpEvent<any>> {
// Only add CSRF for non-GET requests to your API
if (!req.method.includes('GET') && req.url.includes('/api/')) {
const csrfToken = this.getCookie('XSRF-TOKEN');
if (csrfToken) {
req = req.clone({
withCredentials: true,
setHeaders: {
'X-XSRF-TOKEN': csrfToken
});
return next.handle(req);
private getCookie(name: string): string | null {
const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]
+)'));
return match ? match[2] : null;
}
}
2. Register the Interceptor:
// app.module.ts
import { HTTP_INTERCEPTORS } from '@angular/core';
import { CsrfInterceptor } from './csrf.interceptor';
@NgModule({
providers: [
{ provide: HTTP_INTERCEPTORS, useClass: CsrfInterceptor, multi: true }
})
export class AppModule {}
3. Service Example:
// data.service.ts
import { HttpClient } from '@angular/common/http';
@Injectable({ providedIn: 'root' })
export class DataService {
constructor(private http: HttpClient) {}
postData(data: any) {
return this.http.post('/api/data', data, {
withCredentials: true
});
Key Points:
1. Token Flow:
o Spring sends XSRF-TOKEN cookie (automatically
via CookieCsrfTokenRepository)
o Angular reads cookie and sends back as X-XSRF-TOKEN header
2. Important Headers:
Cookie: XSRF-TOKEN=abc123
X-XSRF-TOKEN: abc123
3. Security Considerations:
o Ensure withCredentials: true in Angular requests
o Configure CORS properly on backend
o Keep HttpOnly=false for the CSRF cookie (so Angular can read it)
4. Testing Endpoint (Spring Boot):
@RestController
public class TestController {
@GetMapping("/api/csrf")
public String getCsrf() {
return "CSRF protected endpoint";
}
@PostMapping("/api/test")
public String testPost() {
return "POST successful";
Verification Steps:
1. Check browser cookies after first GET request - should see XSRF-TOKEN
2. Inspect POST requests in DevTools - should include both:
o Cookie header with XSRF-TOKEN
o X-XSRF-TOKEN header
3. Try removing the token header - should get 403 Forbidden
Spring Boot Backend Configuration
1. Spring Security Setup
Configure Spring Security to use CookieCsrfTokenRepository with HttpOnly set
to false, allowing JavaScript to access the CSRF token stored in a cookie:
java
CopyEdit
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import
org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.web.SecurityFilterChain;
import org.springframework.security.web.csrf.CookieCsrfTokenRepository;
@Configuration
public class SecurityConfig {
@Bean
public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
http
.csrf(csrf -> csrf
.csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse()
)
)
.authorizeHttpRequests(auth -> auth
.requestMatchers("/api/**").permitAll()
.anyRequest().authenticated()
.httpBasic();
return http.build();
This configuration ensures that:
CSRF tokens are stored in cookies accessible to JavaScript.
API endpoints under /api/** are publicly accessible.
All other endpoints require authentication.
2. Serving the Angular Application
If you're serving the Angular frontend through Spring Boot, ensure that your
controller maps to the appropriate route:
java
CopyEdit
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class FrontendController {
@GetMapping("/")
public String index() {
return "index.html";
🌐 Angular Frontend Configuration
1. HTTP Interceptor for CSRF Token
Create an HTTP interceptor to read the CSRF token from the cookie and include
it in the headers of HTTP requests:
typescript
CopyEdit
// csrf.interceptor.ts
import { Injectable } from '@angular/core';
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from
'@angular/common/http';
import { Observable } from 'rxjs';
@Injectable()
export class CsrfInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler):
Observable<HttpEvent<any>> {
const csrfToken = this.getCookie('XSRF-TOKEN');
if (csrfToken) {
req = req.clone({
setHeaders: {
'X-XSRF-TOKEN': csrfToken
});
return next.handle(req);
private getCookie(name: string): string | null {
const cookies = document.cookie.split(';');
for (const cookie of cookies) {
const [k, v] = cookie.trim().split('=');
if (k === name) return decodeURIComponent(v);
return null;
2. Registering the Interceptor
In your app.module.ts, register the interceptor:
typescript
CopyEdit
import { HTTP_INTERCEPTORS } from '@angular/common/http';
import { CsrfInterceptor } from './csrf.interceptor';
@NgModule({
...
providers: [
{ provide: HTTP_INTERCEPTORS, useClass: CsrfInterceptor, multi: true }
})
export class AppModule { }
3. Making HTTP Requests
With the interceptor in place, you can make HTTP requests as usual, and the
CSRF token will be automatically included:
typescript
CopyEdit
this.http.post('/api/save-data', { name: 'Test' }).subscribe(response => {
console.log('Saved:', response);
});
🔄 Workflow Summary
1. Initial Request: When the Angular application loads, it makes an initial
request to the Spring Boot backend.
2. CSRF Token Generation: Spring Security generates a CSRF token and
stores it in a cookie named XSRF-TOKEN.
3. Token Retrieval: The Angular interceptor reads the XSRF-TOKEN cookie
and includes its value in the X-XSRF-TOKEN header of subsequent HTTP
requests.
4. Token Validation: Spring Security validates the CSRF token from the
header against the one stored in the cookie. If they match, the request is
processed; otherwise, it's rejected.
📚 Reference Implementation
For a practical example, you can refer to the following GitHub repository:
Spring Security and Angular CSRF Example: This project
demonstrates login, logout, CSRF protection, and authentication guards
using Spring Security 6 and Angular. GitHubGitHub+1YouTube+1
Here's a comprehensive guide to setting up CSRF protection in a Spring Boot
backend with an Angular frontend:
Spring Boot Configuration (Backend)
1. Basic Security Configuration:
java
Copy
Download
@Configuration
@EnableWebSecurity
public class SecurityConfig {
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws
Exception {
http
.csrf(csrf -> csrf
.csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse()
)
.authorizeHttpRequests(auth -> auth
.requestMatchers("/api/**").authenticated()
.anyRequest().permitAll()
)
.formLogin(withDefaults())
.httpBasic(withDefaults());
return http.build();
2. CORS Configuration (for Angular dev server):
java
Copy
Download
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurer() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("http://localhost:4200")
.allowedMethods("*")
.allowCredentials(true);
};
Angular Configuration (Frontend)
1. HttpInterceptor for CSRF:
typescript
Copy
Download
// csrf.interceptor.ts
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent } from
'@angular/common/http';
import { Observable } from 'rxjs';
export class CsrfInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler):
Observable<HttpEvent<any>> {
// Only add CSRF for non-GET requests to your API
if (!req.method.includes('GET') && req.url.includes('/api/')) {
const csrfToken = this.getCookie('XSRF-TOKEN');
if (csrfToken) {
req = req.clone({
withCredentials: true,
setHeaders: {
'X-XSRF-TOKEN': csrfToken
});
}
}
return next.handle(req);
private getCookie(name: string): string | null {
const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]
+)'));
return match ? match[2] : null;
2. Register the Interceptor:
typescript
Copy
Download
// app.module.ts
import { HTTP_INTERCEPTORS } from '@angular/core';
import { CsrfInterceptor } from './csrf.interceptor';
@NgModule({
providers: [
{ provide: HTTP_INTERCEPTORS, useClass: CsrfInterceptor, multi: true }
})
export class AppModule {}
3. Service Example:
typescript
Copy
Download
// data.service.ts
import { HttpClient } from '@angular/common/http';
@Injectable({ providedIn: 'root' })
export class DataService {
constructor(private http: HttpClient) {}
postData(data: any) {
return this.http.post('/api/data', data, {
withCredentials: true
});
Key Points:
1. Token Flow:
o Spring sends XSRF-TOKEN cookie (automatically
via CookieCsrfTokenRepository)
o Angular reads cookie and sends back as X-XSRF-TOKEN header
2. Important Headers:
Copy
Download
Cookie: XSRF-TOKEN=abc123
X-XSRF-TOKEN: abc123
3. Security Considerations:
o Ensure withCredentials: true in Angular requests
o Configure CORS properly on backend
o Keep HttpOnly=false for the CSRF cookie (so Angular can read it)
4. Testing Endpoint (Spring Boot):
java
Copy
Download
@RestController
public class TestController {
@GetMapping("/api/csrf")
public String getCsrf() {
return "CSRF protected endpoint";
@PostMapping("/api/test")
public String testPost() {
return "POST successful";
Verification Steps:
1. Check browser cookies after first GET request - should see XSRF-TOKEN
2. Inspect POST requests in DevTools - should include both:
o Cookie header with XSRF-TOKEN
o X-XSRF-TOKEN header
3. Try removing the token header - should get 403 Forbidden
Would you like me to provide:
1. A complete GitHub repository with this setup?
2. Additional security configurations (like JWT + CSRF combo)?
3. Testing strategies for CSRF protection?
A complete GitHub repository with this setup
I'll outline a complete GitHub repository structure for a Spring Boot + Angular
application with CSRF protection. You can find a ready-to-use implementation
here:
GitHub Repository:
🔗 https://github.com/example/spring-boot-angular-csrf-demo (Note: This is a
placeholder link - see below for actual implementation steps)
Repository Structure
Copy
Download
spring-boot-angular-csrf-demo/
├── backend/ # Spring Boot application
│ ├── src/
│ │ ├── main/
│ │ │ ├── java/com/example/demo/
│ │ │ │ ├── config/
│ │ │ │ │ └── SecurityConfig.java
│ │ │ │ ├── controller/
│ │ │ │ │ └── ApiController.java
│ │ │ │ └── DemoApplication.java
│ │ │ └── resources/
│ │ │ └── application.properties
│ │ └── test/
│ └── pom.xml
├── frontend/ # Angular application
│ ├── src/
│ │ ├── app/
│ │ │ ├── services/
│ │ │ │ └── api.service.ts
│ │ │ ├── interceptors/
│ │ │ │ └── csrf.interceptor.ts
│ │ │ └── app.module.ts
│ │ ├── assets/
│ │ ├── environments/
│ │ └── index.html
│ ├── angular.json
│ └── package.json
└── README.md
How to Set This Up Locally
1. Backend (Spring Boot):
bash
Copy
Download
# Generate new Spring Boot project
spring init --dependencies=web,security backend
2. Frontend (Angular):
bash
Copy
Download
# Create new Angular app
ng new frontend
cd frontend
ng generate interceptor interceptors/csrf
Key Files Implementation
1. Spring Boot Security
Config (backend/src/main/java/.../SecurityConfig.java):
java
Copy
Download
@Configuration
@EnableWebSecurity
public class SecurityConfig {
@Bean
public SecurityFilterChain securityFilterChain(HttpSecurity http) throws
Exception {
http
.csrf(csrf -> csrf
.csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse()
)
.ignoringRequestMatchers("/api/public/**")
.authorizeHttpRequests(auth -> auth
.requestMatchers("/api/public/**").permitAll()
.anyRequest().authenticated()
.cors(cors -> cors.configurationSource(corsConfigurationSource()));
return http.build();
@Bean
CorsConfigurationSource corsConfigurationSource() {
CorsConfiguration configuration = new CorsConfiguration();
configuration.setAllowedOrigins(Arrays.asList("http://localhost:4200"));
configuration.setAllowedMethods(Arrays.asList("GET","POST","PUT","DELETE"));
configuration.setAllowCredentials(true);
configuration.addExposedHeader("X-XSRF-TOKEN");
UrlBasedCorsConfigurationSource source = new
UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", configuration);
return source;
2. Angular CSRF
Interceptor (frontend/src/app/interceptors/csrf.interceptor.ts):
typescript
Copy
Download
import { Injectable } from '@angular/core';
import {
HttpRequest,
HttpHandler,
HttpEvent,
HttpInterceptor
} from '@angular/common/http';
import { Observable } from 'rxjs';
@Injectable()
export class CsrfInterceptor implements HttpInterceptor {
intercept(request: HttpRequest<unknown>, next: HttpHandler):
Observable<HttpEvent<unknown>> {
const token = this.getCookie('XSRF-TOKEN');
const isApiRequest = request.url.startsWith('/api');
const isMutatingRequest = ['POST', 'PUT', 'DELETE',
'PATCH'].includes(request.method);
if (isApiRequest && isMutatingRequest && token) {
request = request.clone({
withCredentials: true,
setHeaders: {
'X-XSRF-TOKEN': token
});
}
return next.handle(request);
private getCookie(name: string): string | null {
const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]
+)'));
return match ? decodeURIComponent(match[2]) : null;
Testing the Implementation
1. Start both applications:
bash
Copy
Download
# In backend directory
./mvnw spring-boot:run
# In frontend directory
ng serve
2. Verify CSRF protection:
Open DevTools and check:
o Cookies tab for XSRF-TOKEN
o Network tab for X-XSRF-TOKEN header in POST requests
