Add axios CSRF interceptor and update CORS config

Introduced a new axios utility in the React app to automatically handle CSRF tokens and redirect on 401 errors. Updated TurStaticResourceConfiguration to support multiple allowed origins, improved CORS settings, and added jackson-datatype-jsr310 dependency in the backend.

Author: alegauss

turing-app/pom.xml

@@ -14,6 +14,7 @@
     <packaging>jar</packaging>
     <properties>
         <elasticsearch.version>9.2.3</elasticsearch.version>
+        <jackson.version>2.20.1</jackson.version>
         <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
         <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
         <maven.compiler.release>21</maven.compiler.release>
@@ -88,7 +89,12 @@
         <dependency>
             <groupId>com.fasterxml.jackson.datatype</groupId>
             <artifactId>jackson-datatype-hibernate7</artifactId>
-            <version>2.20.1</version>
+            <version>${jackson.version}</version>
+        </dependency>
+        <dependency>
+            <groupId>com.fasterxml.jackson.datatype</groupId>
+            <artifactId>jackson-datatype-jsr310</artifactId>
+            <version>${jackson.version}</version>
         </dependency>
         <dependency>
             <groupId>com.viglet.turing</groupId>

turing-app/src/main/java/com/viglet/turing/spring/TurStaticResourceConfiguration.java

@@ -44,13 +44,17 @@ public class TurStaticResourceConfiguration implements WebMvcConfigurer {
     public static final String FORWARD_SN_TEMPLATES_BROWSER_INDEX_HTML = "forward:/sn/templates/browser/index.html";
     public static final String FORWARD_WELCOME_BROWSER_INDEX_HTML = "forward:/welcome/browser/index.html";
     public static final String FORWARD_CONSOLE_BROWSER_INDEX_HTML = "forward:/console/browser/index.html";
-    @Value("${turing.allowedOrigins:localhost}")
+    @Value("${turing.allowedOrigins:http://localhost:5173,http://localhost:2700}")
     private String allowedOrigins;
 
     @Override
     public void addCorsMappings(CorsRegistry registry) {
-        registry.addMapping("/api/**").allowedOrigins(allowedOrigins).allowedMethods("PUT", "DELETE", "GET", "POST")
-                .allowCredentials(false).maxAge(3600);
+        registry.addMapping("/api/**")
+                .allowedOrigins(allowedOrigins.split(","))
+                .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS", "PATCH")
+                .allowedHeaders("*")
+                .allowCredentials(true)
+                .maxAge(3600);
     }
 
     @Override

turing-react/src/lib/axios.ts

@@ -0,0 +1,45 @@
+import axios from "axios";
+
+// Function to get CSRF token from cookies
+function getCsrfToken(): string | null {
+  const match = document.cookie.match(/XSRF-TOKEN=([^;]+)/);
+  return match ? decodeURIComponent(match[1]) : null;
+}
+
+// Configure axios defaults
+axios.defaults.withCredentials = true;
+
+// Add request interceptor to include CSRF token
+axios.interceptors.request.use(
+  (config) => {
+    const csrfToken = getCsrfToken();
+    if (
+      csrfToken &&
+      ["post", "put", "delete", "patch"].includes(
+        config.method?.toLowerCase() || "",
+      )
+    ) {
+      config.headers["X-XSRF-TOKEN"] = csrfToken;
+    }
+    return config;
+  },
+  (error) => {
+    return Promise.reject(error);
+  },
+);
+
+// Add response interceptor to handle errors
+axios.interceptors.response.use(
+  (response) => response,
+  (error) => {
+    if (error.response?.status === 401) {
+      // Handle unauthorized - redirect to login if not already on login page
+      if (!window.location.pathname.startsWith("/login")) {
+        window.location.href = "/login";
+      }
+    }
+    return Promise.reject(error);
+  },
+);
+
+export default axios;

turing-react/src/main.tsx

@@ -1,3 +1,4 @@
+import '@/lib/axios'; // Configure axios interceptors for CSRF
 import axios from 'axios'
 import React from 'react'
 import { createRoot } from 'react-dom/client'