SOP & CORS

SOP

Origin - Two pages have the same origin if the protocol, port (if one is specified), and host are the same for both pages.

Under the policy, a web browser permits scripts contained in a first web page to access data in a second web page, but only if both web pages have the same origin.

Assume you are logged into Facebook and visit a malicious website in another browser tab. Without the same origin policy JavaScript on that website could do anything to your Facebook account that you are allowed to do.

But of course Facebook wants to use JavaScript to enhance the user experience. So it is important that the browser can detect that this JavaScript is trusted to access Facebook resources. That's where the same origin policy comes into play: If the JavaScript is included from a HTML page on facebook.com, it may access facebook.com resources.

The origin of a JavaScript file is defined by the domain of the HTML page which includes it. So if you include the Google Analytics code with a <script>-tag, it can do anything to your website but does not have same origin permissions on the Google website.

The same origin policy is not enforced for all requests. Among others the <script>- and <img>-tags may fetch resources from any domain.

HTTP cookies are dependent on the Same Origin Policy to ensure that sensitive information held about a certain user's activity pertains only to one site.

CORS

This cross-origin sharing standard is used to enable cross-site HTTP requests for:

• Invocations of the XMLHttpRequest or Fetch APIs in a cross-site manner, as discussed above.
• Web Fonts (for cross-domain font usage in @font-face within CSS)
• Images/video frames drawn to a canvas using drawImage.
• Stylesheets (for CSSOM access).

The Cross-Origin Resource Sharing standard works by adding new HTTP headers that allow servers to describe the set of origins that are permitted to read that information using a web browser.

Simple request

Some requests don’t trigger a CORS preflight. Those are called “simple requests” in this article. A request that doesn’t trigger a CORS preflight—a so-called “simple request”—is one that meets all the following conditions:

• The only allowed methods are:
• GET
• HEAD
• POST

The only allowed values for the Content-Type request header for simple requests are:

• application/x-www-form-urlencoded
• multipart/form-data
• text/plain

.......and more

Preflighted request

Unlike “simple requests” (discussed above), "preflighted" requests first send an HTTP request by the OPTIONS method to the resource on the other domain, in order to determine whether the actual request is safe to send.