Table of Contents:
Understanding Cross-Origin Requests
The Role of CORS
What Makes a Cross-Origin Request Illegal?
Technical Mechanisms Behind Illegal Requests
FAQ

What is an illegal Cross-Origin request

Ever wondered why that cool feature on your website isn’t working as expected? It the might be because of an illegal cross-origin request. This occurs when a web application from one source attempts to access resources from another source without proper permission. This is a security measure designed to keep you and your users safe.

Understanding Cross-Origin Requests

A cross-origin request takes place when a webpage, loaded from one location (defined by the protocol, hostname, as well as port), tries to get resources from a different location. For instance, consider a situation. A webpage at `https://example.com` attempts to make an HTTP request to `https://api.example.org`. This is a cross-origin request.

• Modern web browsers have a built-in security policy called the Same-Origin Policy (SOP).
• It blocks this sort of request by default unless the target server allows it using specific CORS headers.

The Role of CORS

What is CORS? Cross-Origin Resource Sharing (CORS) is a security system. It allows servers to specify which origins are allowed to access their resources using HTTP headers. When a browser makes a cross-origin request, it adds an `Origin` header. This header states its own domain. After this, the server checks the `Origin` header against its allowed origins list. It sends back CORS headers, like `Access-Control-Allow-Origin`, if it grants access. In the case of no access, the browser stops the response from reaching the script.

What Makes a Cross-Origin Request Illegal?

A cross-origin request becomes “illegal” or unauthorized when it breaks SOP or CORS policies, that are enforced by both browsers also servers. These are a few instances when this might happen.

• Violation of Same-Origin Policy – Web browsers block scripts. They run on one origin from accessing data returned from another. This happens unless explicit permission is given via CORS headers.
• Absence of Proper CORS Headers – If the server of a requested resource does not contain needed CORS headers like `Access-Control-Allow-Origin`, a script from a different origin to read or use it will be stopped as illegal.
• Unauthorized Preflight Requests – Browsers do a ‘preflight’ request using the OPTIONS method. This happens for certain requests using custom HTTP methods or non-standard headers before doing the real call. A failed preflight, caused by missing or wrong CORS response headers on the server, causes following requests to be rejected as illegal.

In summary, an illegal cross-origin request is an attempt made across domains. It lacks express authorization with the proper security configuration, like SOP and/or correct CORS implementation.

Technical Mechanisms Behind Illegal Requests

Preflight Requests

For complex requests, browsers start preflight requests. These use the OPTIONS method. This pre-check validates whether operations proceed, based on permissions in response metadata.

If required permissions are missing, meaning no valid `Access-Control-Allow-Methods` or `Access-Control-Allow-Credentials` exist, attempts will be deemed illegal per browser enforcement until fixed at the backend.

FAQ

Why do I see a CORS error?

A CORS error shows up when a web page tries to get resources from a different domain. This happens without the other domain allowing it through CORS headers. It is a security feature to stop malicious websites from accessing sensitive data.

How do I fix CORS issues?

Fixing CORS needs changes on the server hosting the resources you want to access. You should add the `Access-Control-Allow-Origin` header to the server’s responses. This header lists which origins are allowed to access the resource. Use “*” to allow all origins (not suggested for production) or list specific domains.

Is CORS a browser feature?

Yes, CORS is primarily enforced by web browsers. Browsers block JavaScript code from accessing responses to cross-origin requests if the server has not included the correct CORS headers. Servers can still receive the request, but the browser prevents the client-side script from accessing the response.

Resources & References:

1. https://www.moesif.com/blog/technical/api-development/What-is-CORS-Essential-Guide-to-Cross-Origin-Resource-Sharing/
2. https://konghq.com/blog/learning-center/what-is-cors-cross-origin-resource-sharing
3. https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/Cross-Origin_Resource_Policy
4. https://docs.aws.amazon.com/AmazonS3/latest/userguide/cors.html
5. https://requestly.com/blog/what-is-cors-and-how-to-bypass-it/