diff --git a/ccw/frontend/src/lib/api.ts b/ccw/frontend/src/lib/api.ts index b188e5e1..cc49a934 100644 --- a/ccw/frontend/src/lib/api.ts +++ b/ccw/frontend/src/lib/api.ts @@ -232,6 +232,25 @@ export async function initializeCsrfToken(): Promise { } } +// ========== Auth Initialization ========== + +/** + * Acquire auth cookie from server. + * On localhost the auth middleware bypasses public paths, so the cookie is + * redundant but harmless. For remote access (--host 0.0.0.0) the cookie + * is required — without it every API call returns 401. + * + * Must be called once before the React tree renders so that TanStack Query + * hooks already have the cookie when they fire their first requests. + */ +export async function initializeAuth(): Promise { + try { + await fetch('/api/auth/token', { credentials: 'same-origin' }); + } catch { + // Server may not be reachable yet — localhost public-path bypass still works + } +} + // ========== Base Fetch Wrapper ========== /** diff --git a/ccw/frontend/src/main.tsx b/ccw/frontend/src/main.tsx index ea6c7970..21682647 100644 --- a/ccw/frontend/src/main.tsx +++ b/ccw/frontend/src/main.tsx @@ -7,14 +7,16 @@ import 'react-resizable/css/styles.css' import 'xterm/css/xterm.css' import { loadMessagesForLocale, getInitialLocale } from './lib/i18n' import { logWebVitals } from './lib/webVitals' +import { initializeAuth } from './lib/api' async function bootstrapApplication() { const rootElement = document.getElementById('root') if (!rootElement) throw new Error('Failed to find the root element') - // CSRF token initialization is deferred to first mutating request - // This eliminates network RTT from app startup path - // See: ccw/frontend/src/lib/api.ts - fetchApi handles lazy token fetch + // Acquire auth cookie before rendering — required for remote access (--host 0.0.0.0). + // On localhost, auth middleware bypasses public paths so this is harmless. + await initializeAuth() + const locale = await getInitialLocale() // Load only the active locale's messages (lazy load secondary on demand)