**Core concept (TL;DR).** CORS (Cross-Origin Resource Sharing) is a **browser** security mechanism that relaxes the Same-Origin Policy in a controlled way. When a page makes a request to a *different* origin, the browser only exposes the response to JavaScript if the **server** opts in with the right Access-Control-Allow-* response headers. The server's headers tell the browser what's allowed

hardFrontend

What is CORS?

1.1k views

Understand the problem

Explain cross-origin resource sharing.

cors

Attempt it yourself

Sketch your approach before reading the solution — that's what interviews test.

Stuck? AI Nudge Available

Get a conceptual hint to guide your logic without spoiling the final implementation.

Study the solution

The solution is waiting

Give it an honest attempt first — then compare your thinking with the full walkthrough.

Read the code

Cross-origin fetch + the headers that unblock it

// A page on https://app.com calling a different origin:
fetch("https://api.other.com/data")
  .then((res) => res.json())
  .then(console.log);

// The BROWSER only reveals the response if the server replies with:
//   Access-Control-Allow-Origin: https://app.com   (or *)
//
// For "non-simple" requests (PUT/DELETE, custom headers) the browser
// first sends a preflight OPTIONS request; the server must answer:
//   Access-Control-Allow-Methods: PUT
//   Access-Control-Allow-Headers: Content-Type
//
// To send cookies, the client uses { credentials: "include" } AND the
// server must set Access-Control-Allow-Credentials: true (origin can't be *).

Join the discussion

Discussion (0)

No responses yet. Be the first to share what you think.

What is the difference between Promise.all, allSettled, race, and any?

Tricky JavaScript Scenario #87: Array element kinds optimization