NeonClary Cursor commited on
Commit
69d90be
·
1 Parent(s): 6cac4f0

fix(frontend): default API_BASE to '' so Docker builds use same-origin

Browse files

When REACT_APP_API_URL is unset (the typical case for the Docker
build, where Dockerfile already passes REACT_APP_API_URL=), the
bundle now resolves API_BASE to '' (relative URLs) instead of
hardcoding http://localhost:8000. Previously a host-side
pm run
build without that env var silently baked the localhost URL into
the bundle, causing every API call from a Docker deployment served
on a different port (3002/8002/7860) to fail with CORS or refuse
the connection - which is what produced the empty Persona dropdown
in earlier sessions.

Inline comment documents the dev-server escape hatch
(REACT_APP_API_URL=http://localhost:8000 in .env.development) for
the CRA
pm start workflow.

Co-authored-by: Cursor <cursoragent@cursor.com>

Files changed (1) hide show
  1. frontend/src/utils/api.js +11 -1
frontend/src/utils/api.js CHANGED
@@ -1,6 +1,16 @@
 
 
 
 
 
 
 
 
 
 
1
  const API_BASE = process.env.REACT_APP_API_URL !== undefined
2
  ? process.env.REACT_APP_API_URL
3
- : 'http://localhost:8000';
4
 
5
  export async function fetchModels() {
6
  const resp = await fetch(`${API_BASE}/api/models`, { cache: 'no-store' });
 
1
+ // Default to '' (relative URLs) so any production-style build - whether
2
+ // done inside Docker (Dockerfile sets REACT_APP_API_URL=) or on the host
3
+ // without that env var - hits the same origin that served the page. This
4
+ // avoids the cross-origin trap where a `npm run build` on the host
5
+ // without REACT_APP_API_URL would silently bake `http://localhost:8000`
6
+ // into the bundle and break every API call from a Docker deployment.
7
+ //
8
+ // If you want the CRA dev server (`npm start` on :3000) to talk to a
9
+ // FastAPI backend on :8000, set REACT_APP_API_URL=http://localhost:8000
10
+ // in `frontend/.env.development` or your shell.
11
  const API_BASE = process.env.REACT_APP_API_URL !== undefined
12
  ? process.env.REACT_APP_API_URL
13
+ : '';
14
 
15
  export async function fetchModels() {
16
  const resp = await fetch(`${API_BASE}/api/models`, { cache: 'no-store' });