CORS Error Fix | Access-Control-Allow-Origin

Ever seen “No ‘Access-Control-Allow-Origin’ header” when calling an API from the frontend? This article explains why and how to fix it.

What is CORS?

Browsers enforce the same-origin policy. A page on https://example.com calling https://api.other.com is cross-origin and blocked by default. The server must send Access-Control-Allow-Origin to allow it.

Key Point: Fix on the Server

CORS is a server-side setting. Changing frontend code won’t help if the server doesn’t send the right headers.

Solutions

Your Own API

Add Access-Control-Allow-Origin to responses. Use * for dev only; restrict to specific origins in production.

Third-Party API

If the API doesn’t support CORS, use a backend proxy: Frontend → Your server → External API. Your server is same-origin, so CORS doesn’t apply.

Dev Workarounds

Use CORS-enabled APIs for testing, or a local proxy. Never disable CORS in the browser for production. When inspecting API responses, the JSON Formatter and JWT Decode tools come in handy.

Summary

CORS errors mean the server isn’t allowing your origin. Fix server config or use a proxy.