DeployAPIEnv vars

TypeError: Failed to fetch / ECONNREFUSED: app calls localhost in production

TypeError: Failed to fetch (request to http://localhost:3000/api/...)

In short: The deployed app still points at http://localhost, which on your user's device (or the server) is not your backend.

Why it happens

A base URL like http://localhost:3000 or http://127.0.0.1:8000 was hard-coded during development. In production, localhost means the visitor's own computer (in the browser) or the serverless function itself (on the server).

How to fix it

1. Search the code for localhost and 127.0.0.1.
2. Same-origin API routes: use relative URLs like /api/items from the browser.
3. Separate backend: put its URL in an env var (NEXT_PUBLIC_API_URL / VITE_API_URL) and set the production value on your host.
4. Server code calling its own API routes: call the underlying function directly instead of fetching your own URL.
5. If the backend is HTTP and the site is HTTPS, see the mixed-content fix.

Copy-paste fix prompt

I'm getting this error in my app:

TypeError: Failed to fetch (request to http://localhost:3000/api/...)

[Paste the full error, stack trace, and the file it points to here]

Likely cause: The deployed app still points at http://localhost, which on your user's device (or the server) is not your backend.

Task: Find every hard-coded localhost/127.0.0.1 URL and replace each with a relative path or an environment-based base URL, then list the env vars I must set on my host.

Rules:
- First explain the root cause in 2 sentences and list the files you'll change.
- Make the smallest change that fixes it. Don't refactor unrelated code.
- Don't disable security or checks (RLS, auth, signature verification, type checking, CORS allow-all) to make the error disappear.
- Never print or hard-code secret keys.
- Finish by telling me exactly how to verify the fix.

Common with: Cursor, Bolt, Lovable, v0. Last reviewed 2026-11-13.