The Beginner's Biggest Frustration

You make a fetch to another site and see a red error in the console: ** " CORS policy blocked " **. What is this?

The Problem: Same-Origin Policy

By default, the browser only allows a page at mysite.com to make requests to mysite.com. This is a security protection: it prevents a malicious site from silently using your active login session (cookies) to steal your data from another site.

How CORS Works

Before sending your request, the browser asks the target server:

" My page at mysite.com wants your data. Is that OK? "

The server must respond with a header:

Access-Control-Allow-Origin: https://mysite.com

Only then does the browser allow the response through.

A " Preflight " Request

For certain request types (POST with JSON, custom headers), the browser first sends an OPTIONS request to check permissions before sending the real request.

How to Fix CORS Errors

• You control the API: Configure your server to include the correct Access-Control-Allow-Origin header.
• You don't control the API: Use a backend proxy — your server fetches the data and forwards it to you.