Cross-origin resource sharing

lastmod 2025-03-06created 2021-09-1810 edits

Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the first resource was served. A web page may freely embed cross-origin images, stylesheets, scripts, iframes, and videos. Certain cross-domain requests, notably Ajax requests, are forbidden by default by the same-origin security policy.

CORS defines a way in which a browser and server can interact to determine whether it is safe to allow a cross-origin request. It allows for more freedom and functionality than purely same-origin requests, but is more secure than simply allowing all cross-origin requests. The CORS specification was originally published as a W3C Recommendation, but that document is obsolete. The actively maintained specification that currently defines CORS is WHATWG's Fetch Living Standard.

Cross-Origin Request Blocked

• CORS errors - HTTP | MDN
• Reason: CORS header 'Access-Control-Allow-Origin' missing - HTTP | MDN
• 3 Ways to Fix the CORS Error — and How the Access-Control-Allow-Origin Header Works | by David Katz | Medium

"Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at $somesite"

Add the following to the Response Header on the server side:

Access-Control-Allow-Origin: *

Use the wildcard (*) only on development servers.

On production servers, enter the exact Origin.

Access-Control-Allow-Origin: https://your-origin-site.com

CORS is stupid

• CORS is Stupid - Kevin Cox

1. Understand that CORS is a stopgap for a browser design flaw.
   • CORS (cross-origin resource sharing) addresses security problems caused by implicit credentials in cross-origin requests.
   • The browser's default behavior puts users at risk of XSRF attacks.
   • CORS tries to mitigate these problems, but has fundamental limits in its security scope.
2. CORS prevents reading the results of cross-origin requests, but does not block the requests themselves.
   • fun-games.example cannot read data from your-bank.example, but can still execute state-changing requests such as transferring funds.
   • This is because of how browsers handle cookies and credentials by default.
3. Effective cross-origin security starts with ignoring implicit credentials.
   • Remove cookie-like credentials from cross-origin requests or allow them explicitly.
   • Use middleware that leverages Sec-Fetch-* headers to filter or remove cross-origin cookies.
4. Explicit credentials are a safer alternative to implicit credentials.
   • Use the Authorization header for authentication tokens instead of cookies.
   • Explicit credentials prevent credential misuse across different sites.
   • Not suitable for server-rendered sites, but the best approach for APIs and client-side applications.
5. Implement SameSite cookies to limit cross-origin credential use.
   • Use SameSite=Lax so that cookies are not included in cross-origin requests by default.
   • Choose SameSite=Strict for a stricter policy. However, this can affect usability (e.g., being logged out after cross-origin navigation).
6. Adopt a simple and safe CORS policy.
   • Default policy: Access-Control-Allow-Origin: * and Access-Control-Allow-Methods: * allow only anonymous access.
   • This policy disables implicit credentials in cross-origin requests, protecting the site from unintended credential misuse.
7. Don't overcomplicate your CORS policy for the sake of security.
   • Overly specific settings can create a false sense of security.
   • CORS proxies and other workarounds can bypass browser-enforced policies, nullifying efforts to restrict access.
8. Understand the broader movement toward safer web defaults.
   • Browsers are exploring approaches such as State Partitioning (Firefox), Tracking Prevention (Safari), and CHIPS (Chrome) to solve the cross-origin credential problem.
   • These initiatives aim to improve user security and privacy by limiting cookie and credential sharing across origins.
9. Recognize that CORS is an incomplete solution.
   • CORS's backward compatibility adds complexity while not fully solving the underlying security problem.
   • Browsers are slowly adopting new approaches to mitigate these problems, but progress is inconsistent.

See also

• HTTP
• aiohttp-cors
• Preflight request (CORS Preflight)
• Cross-Site Request Forgery (CSRF)
• Cross-Origin Resource Sharing (CORS)

Favorite site

• Wikipedia (en) Cross-origin resource sharing
• [Recommended] Why does CORS give us such a hard time? ¹
• What is CORS? – Han Yun-seok's dev blog
• What is CORS? - Cross-Origin Resource Sharing Explained - AWS
• Why use both CSRF protection and CORS? | GeekNews
  • [Original] Cross-Site Requests | SMAGIN

References