CORS

The Same-Origin Policy

Browsers enforce a Same-Origin Policy (SOP) that prevents JavaScript on one origin from reading responses from a different origin. An origin is defined by scheme + hostname + port (e.g., https://api.example.com:443). This policy protects users from malicious sites making authenticated HTTPSHTTP Secure. The encrypted version of HTTP that uses TLS to protect data in transit between a browser and a web server. Identified by the padlock icon in browsers and the https:// URL scheme. requests to banking or social media APIs on their behalf. CORS (Cross-Origin Resource Sharing) is the W3C standard mechanism that allows servers to selectively relax the SOP for specific cross-origin requests.

Preflight and Simple Requests

For simple requests (GET, HEAD, POST with plain-text content types), the browser includes an Origin header and the server responds with Access-Control-Allow-Origin. If the response header matches the requesting origin (or is *), the browser allows the JavaScript to read the response. For non-simple requests — those using custom headers, PUT/DELETE methods, or HTTPHypertext Transfer Protocol. The application-layer protocol for transmitting web pages, APIs, and other resources. HTTP defines methods (GET, POST, PUT, DELETE) and status codes for client-server communication. JSON bodies — the browser first sends a preflight OPTIONS request. The server must respond with Access-Control-Allow-Methods and Access-Control-Allow-Headers before the actual request is sent.

Common Misconfigurations

Reflecting the Origin header unconditionally (returning whatever origin the request claims) effectively disables cross-origin protection, especially when combined with Access-Control-Allow-Credentials: true, which permits cookies and auth headers to be included. Setting Access-Control-Allow-Origin: * with credentials is explicitly forbidden by the spec. CORS errors are a common source of frustration for API developers; use HTTP Header Analyzer to inspect the CORS headers a server returns and diagnose configuration issues. REST APIRepresentational State Transfer Application Programming Interface. An architectural style for web services that uses standard HTTP methods (GET, POST, PUT, DELETE) and stateless communication to manipulate resources identified by URLs. design should always consider CORS requirements from the start. WebSocketA communication protocol that provides full-duplex, persistent connections between a browser and server over a single TCP connection. Ideal for real-time applications like chat, live dashboards, and multiplayer games. connections bypass CORS entirely — they use the WebSocket handshake origin check instead, which servers must validate independently.