Ce este CORS și cum îl gestionezi în Node?

Question

Accepted Answer

**CORS** (Cross-Origin Resource Sharing) este un mecanism de securitate al browserului care controlează dacă o pagină web de pe o **origine** poate face cereri la un server pe o **origine diferită**. În mod implicit, browserele blochează cererile cross-origin; serverul trebuie să le permită în mod explicit prin header-ele de răspuns.

## Politica same-origin și problema

```text
Origin = scheme + host + port. These are DIFFERENT origins:
  https://app.example.com   →  https://api.example.com   (different host)
  http://localhost:3000     →  http://localhost:4000      (different port)

Browser blocks the cross-origin request UNLESS the server sends CORS headers allowing it.
```

So a React app on `localhost:3000` calling an API on `localhost:4000` is cross-origin — the browser blocks it unless the API opts in.

## Header-ele cheie de răspuns

```text
Access-Control-Allow-Origin: https://app.example.com   ← who is allowed
Access-Control-Allow-Methods: GET, POST, PUT, DELETE   ← allowed methods
Access-Control-Allow-Headers: Content-Type, Authorization
Access-Control-Allow-Credentials: true                 ← allow cookies/auth
```

Serverul controlează accesul trimitând acești header-i. Browserul îi citește și decide dacă permite paginii să vadă răspunsul.

## Gestionarea CORS în Express

```js
import cors from "cors";

// ❌ allow everything — convenient but insecure for credentialed/private APIs
app.use(cors());

// ✅ restrict to specific trusted origins
app.use(cors({
  origin: ["https://app.example.com", "http://localhost:3000"], // allowlist
  methods: ["GET", "POST", "PUT", "DELETE"],
  credentials: true, // allow cookies — REQUIRES a specific origin (not "*")
}));
```

Middleware-ul `cors` setează header-ele pentru tine. Pentru producție, **restricționează `origin` la o listă de permisiuni** în loc de `*` — și rețineți că permiterea credențialelor (`credentials: true`) este incompatibilă cu wildcard-ul `*`.

## Cererile preflight

```text
For "non-simple" requests (PUT/DELETE, custom headers, JSON), the browser first
sends an OPTIONS "preflight" request to check permissions. The cors middleware
handles responding to it automatically.
```

## Înțelegere greșită comună

```text
CORS is enforced by the BROWSER, not the server. It does NOT protect your API
from non-browser clients (curl, Postman, other servers) — those ignore CORS.
It only governs what browser JavaScript on other origins can do.
```

## De ce este important

CORS este una dintre cele mai frecvente piedici în dezvoltarea web — aproape fiecare configurație front-end-către-API o întâlnește (mai ales în dev local cu porturi diferite).

Înțelegerea *de ce* există (securitatea same-origin a browserului), cum se manifestă serverul prin header-i, cum să-l configurezi în siguranță (liste de permisiuni pentru origine, gestionarea atentă a credențialelor) și faptul crucial că este un mecanism *browser* (nu autorizare API) este esențial pentru a conecta corect și în siguranță front-end-urile cu API-urile Node fără a fi blocat sau a expune în exces serverul.