Error Reference › Browser / Network
Browser / Network
Blocked by CORS policy
The browser blocked a request because the server it called did not say your site is allowed to read the response.
What it looks like
Access to fetch at 'https://api.example.com/data' from origin 'https://app.example.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.What does "Blocked by CORS policy" mean?
It appears in the browser’s DevTools console, never in the server log — the request usually reached the server and got an answer, but the browser refused to hand that answer to your JavaScript. CORS is a browser rule: the same request from curl or a backend works fine, which is why it is so confusing.
What causes "Blocked by CORS policy"?
- The API server doesn't send the Access-Control-Allow-Origin header for your origin.
- You're calling a different domain/port/protocol from the page's origin.
- A preflight (OPTIONS) request isn't handled by the server.
How do I confirm the cause?
- Open the Network tab, click the failed request and look at its response headers. If Access-Control-Allow-Origin is missing, the server is not opting in.
- Look for an OPTIONS request just before it. If that preflight fails (404, 405 or no CORS headers), the real request never gets sent.
- Check the exact origin in the message — http vs https, www vs no www and the port all count as different origins.
How do I fix "Blocked by CORS policy"?
- On the server, send Access-Control-Allow-Origin (your origin, not just *) and handle OPTIONS requests.
- If you don't control the API, proxy the request through your own backend.
- For credentials, set Access-Control-Allow-Credentials and a specific origin (not *).
How do I stop it happening again?
- Configure CORS once, in the server or framework middleware, with an explicit list of allowed origins.
- Keep API calls same-origin where you can (serve the API under your own domain, or proxy it), so CORS never comes up.