1.4.1 - upgrade fetch interceptor from path-prefix to origin-based credential matching

Author: nik2208

src/ui/assets/auth.js

@@ -104,21 +104,47 @@
     window.fetch = async function (input, init = {}) {
         const url = typeof input === 'string' ? input : input.url;
 
-        if (!init.headers) init.headers = {};
-        if (init.headers instanceof Headers) {
-            const token = getCookie('__Host-csrf-token') || getCookie('__Secure-csrf-token') || getCookie('csrf-token');
-            if (token) init.headers.set('X-CSRF-Token', token);
-        } else {
-            init.headers = addCsrfHeader(init.headers);
+        // Derive the auth backend origin so that every request to the same
+        // domain as the auth server gets credentials/CSRF headers — not just
+        // requests whose path starts with apiPrefix.  This covers routes like
+        // /mcp on the same host as /auth (cross-domain headless deployments).
+        //
+        // We use window.location.href as the base for resolving relative URLs.
+        // Try/catch guards against malformed URLs; on failure both origins stay
+        // null and only the isAuthEndpoint() path-based fallback is used.
+        let backendOrigin = null;
+        let requestOrigin = null;
+        try {
+            const pageBase = window.location?.href || '';
+            backendOrigin = UI_CONFIG.apiPrefix.startsWith('http')
+                ? new URL(UI_CONFIG.apiPrefix).origin
+                : new URL(pageBase).origin;
+            requestOrigin = new URL(url, pageBase).origin;
+        } catch (_) { /* malformed URL — isAuthEndpoint() below handles known endpoints */ }
+
+        const isBackendRequest = backendOrigin !== null && backendOrigin === requestOrigin;
+        const isAuthRequest = isBackendRequest || isAuthEndpoint(url);
+
+        if (isAuthRequest) {
+            if (!init.headers) init.headers = {};
+            if (init.headers instanceof Headers) {
+                const token = getCookie('__Host-csrf-token') || getCookie('__Secure-csrf-token') || getCookie('csrf-token');
+                if (token) init.headers.set('X-CSRF-Token', token);
+            } else {
+                init.headers = addCsrfHeader(init.headers);
+            }
+            init.credentials = init.credentials || 'include';
         }
-        init.credentials = init.credentials || 'include';
 
         let response = await originalFetch(input, init);
 
         if ((response.status === 401 || response.status === 403) && !isAuthEndpoint(url)) {
             try {
                 const refreshResult = await refreshToken();
-                if (refreshResult && refreshResult.success) {
+                // Use a lenient check that accepts both { success: true } and
+                // other truthy payloads (e.g. { accessToken: "..." }) that the
+                // backend may return without an explicit `success` field.
+                if (refreshResult && refreshResult.success !== false) {
                     if (_overrides.onRefreshSuccess) _overrides.onRefreshSuccess(refreshResult);
                     if (!(init.headers instanceof Headers)) {
                         init.headers = addCsrfHeader(init.headers);
@@ -395,7 +421,8 @@
          */
         async refresh() {
             const result = await refreshToken().catch(() => null);
-            return !!(result && result.success);
+            // Succeeds if result.success is explicitly true OR if result is simply an object (e.g. {accessToken: "..."})
+            return !!(result && (result.success !== false));
         },
 
         // --- SESSION ---

tests/auth-js.test.ts

@@ -922,7 +922,8 @@ describe('fetch interceptor — CSRF', () => {
 
         fetchMock.mockResolvedValueOnce(fakeResponse({ data: 'ok' }));
 
-        await fetch('/api/data');
+        // CSRF headers are only injected for auth backend requests
+        await fetch('/auth/me');
 
         const [, opts] = fetchMock.mock.calls[0];
         expect(opts.headers['X-CSRF-Token']).toBe('test-csrf-value');
@@ -938,18 +939,44 @@ describe('fetch interceptor — CSRF', () => {
 
         fetchMock.mockResolvedValueOnce(fakeResponse({ data: 'ok' }));
 
-        await fetch('/api/data');
+        await fetch('/auth/me');
 
         const [, opts] = fetchMock.mock.calls[0];
         expect(opts.headers?.['X-CSRF-Token']).toBeUndefined();
     });
 
-    it('adds credentials: include when not explicitly set', async () => {
+    it('adds credentials: include on auth backend requests', async () => {
+        fetchMock.mockResolvedValueOnce(fakeResponse({ data: 'ok' }));
+
+        await fetch('/auth/me');
+
+        const [, opts] = fetchMock.mock.calls[0];
+        expect(opts.credentials).toBe('include');
+    });
+
+    it('does NOT add credentials: include on cross-origin third-party API requests', async () => {
+        // Third-party APIs (e.g. LiteLLM, OpenAI, Stripe) return
+        // Access-Control-Allow-Origin: * which browsers block if the request
+        // includes credentials. The interceptor must leave them untouched.
+        fetchMock.mockResolvedValueOnce(fakeResponse({ data: 'ok' }));
+
+        await fetch('https://litellm.external.com/v1/chat/completions');
+
+        const [, opts] = fetchMock.mock.calls[0];
+        // credentials must remain unset for cross-origin third-party requests
+        expect(opts.credentials).toBeUndefined();
+    });
+
+    it('adds credentials: include on same-origin non-auth-prefix requests (e.g. /mcp on the auth server)', async () => {
+        // When the SPA and auth backend share the same origin, any request to
+        // that origin should receive credentials — including /mcp or other
+        // non-/auth-prefixed routes on the same server.
         fetchMock.mockResolvedValueOnce(fakeResponse({ data: 'ok' }));
 
-        await fetch('/api/data');
+        await fetch('/mcp/tool');
 
         const [, opts] = fetchMock.mock.calls[0];
+        // same origin as apiPrefix → gets credentials
         expect(opts.credentials).toBe('include');
     });
 
@@ -984,6 +1011,25 @@ describe('fetch interceptor — auto-refresh', () => {
         expect(fetchMock).toHaveBeenCalledTimes(3);
     });
 
+    it('retries after refresh when backend returns no explicit success field (lenient check)', async () => {
+        // Some backends return { accessToken: "..." } without an explicit success field.
+        // The interceptor must treat any truthy response without success:false as a success.
+        fetchMock
+            .mockResolvedValueOnce(fakeResponse({ error: 'Unauthorized' }, 401))
+            .mockResolvedValueOnce(fakeResponse({ accessToken: 'new-token' }))  // no success field
+            .mockResolvedValueOnce(fakeResponse({ data: 'ok' }));
+
+        Object.defineProperty(window, 'location', {
+            writable: true,
+            configurable: true,
+            value: { pathname: '/dashboard', href: 'http://localhost/dashboard', set href(v) {} },
+        });
+
+        await fetch('/api/protected');
+
+        expect(fetchMock).toHaveBeenCalledTimes(3);
+    });
+
     it('retries original request after successful token refresh on 403 (Forbidden)', async () => {
         fetchMock
             .mockResolvedValueOnce(fakeResponse({ error: 'Forbidden' }, 403))  // 1st call → 403