Fix a CORS error between frontend and API

CORS errors are fixed on the server, not in the browser. This prompt explains why your request is blocked, whether it triggers a preflight, and the correct headers for local development and your live site.

text-code-cors-error-fix — claude — 88 words

Act as a web developer who understands CORS well.

Frontend: [e.g. React app on http://localhost:5173]
API: [e.g. Express on http://localhost:3000, later api.mysite.com]
Exact browser error:
[PASTE THE CONSOLE ERROR]
The request: [METHOD, HEADERS, e.g. POST with JSON and a cookie]
Server code that sets headers (if any): [PASTE]

Explain in plain words why the browser blocks this request, including whether it triggers a preflight. Give the correct server-side fix for development and for production. Do not suggest allowing every origin with credentials, and do not suggest browser extensions.

Edit in the builder Copy & open Claude ↗Copy & open ChatGPT ↗Copy & open Gemini ↗

CORS is fixed on the server, not in the frontend. Paste the exact error text, because each message points to a different missing header.

Get a better result

What you will get

A plain explanation of why the browser blocks your request, whether it triggers a preflight, and the right server-side headers for development and for production, without “allow everything” shortcuts or browser extensions.

Why it works

CORS errors look alike but each one points at a different header, so the prompt asks for the exact console text. Giving both the local and the production addresses lets it write a fix that survives deploy. The two bans at the end block the most common bad advice: opening the API to every site with cookies, and extensions that only hide the problem on your own machine.

Common mistake

The fix sets the allowed origin to * while sending cookies.

Fix: Browsers refuse that combination. Ask for your exact frontend origin in the allow list and credentials allowed only for it.

Also watch for

The preflight OPTIONS request still fails. Paste the network tab entry for the OPTIONS call and ask it to make the server answer it before any auth check runs.
It works locally but breaks after deploy. List the real production domains, including www and non www, and ask for the allow list to read them from config.

Try a variation: use a dev proxy instead

Ask how to proxy API calls through your frontend dev server in development, so both share one origin and CORS never comes up locally.

Still not right? Reply with this

I applied the fix and now the browser shows this error instead: [PASTE NEW ERROR]. Explain what it means and what to change.