csrf/spa_frameworks

Modern SPA frameworks CSRF protection via cookie-to-header pattern

Modern Single Page Application frameworks (Angular, React, Vue) typically use cookie-to-header pattern for CSRF protection: (1) Server generates CSRF token when user authenticates and sets token in non-HttpOnly, non-Secure cookie (e.g., XSRF-TOKEN) with SameSite=Lax or Strict; (2) SPA framework reads token from cookie; (3) For state-changing requests (POST, PUT, DELETE), client sets token as custom HTTP header (commonly X-XSRF-TOKEN or X-CSRF-TOKEN); (4) Server validates token from header matches token from cookie - accept if match, reject if mismatch. This approach leverages automatic cookie inclusion by browser but requires custom header from JavaScript for CSRF protection.