This lesson's interactive features are locked, please to keep using them
Cross-Origin Resource Sharing
Cross-Origin Resource Sharing (CORS) lets a server tell browsers which other origins may read its responses. It's a browser security mechanism, not authentication, and it doesn't stop requests from curl, server-side programs, or other non-browser clients.
Click to play video
Preflight
For some cross-origin requests, the browser sends a preflight OPTIONS request before the real request. The response needs to approve the requesting origin, method, and any non-safelisted headers. Otherwise, the browser refuses to send the actual request.
Requests that don't require preflight may still be sent, but JavaScript can't read their responses unless the server grants access.
Bearly Secure's CORS Bug
Bearly Secure reflects every requesting Origin into Access-Control-Allow-Origin and sends Access-Control-Allow-Credentials: true. Instead of limiting access, that policy tells the browser that any website asking for authenticated data may read it.
An attacker's page can make a credentialed request:
const response = await fetch("http://localhost:3030/api/account", {
credentials: "include",
});
const account = await response.json();
The same-origin policy would normally block the attacker from reading the response. Bearly Secure's CORS headers explicitly grant that origin access, so the browser exposes the authenticated data to the attacker's JavaScript.