Skip to content

CORS SOP

Terms

Same-Origin Policy - browsers enforce a same-origin policy to prevent one origin from accessing resources (images, HTML, data, JSON, etc.) on a different origin. Credentials are Cookies and HTTP Authentication Origin is a combination of protocol, hostname and port

Rules for fetch method in js

Rules depends on fetch init settings: mode, credentials

Mode cors (default)

Fetching another origin

cors no-cors same-origin
GET, HEAD, POST Outgoing request will be sent | JS can read response if the server sends right CORS headers Outgoing request will be sent | JS can't read response Outgoing request will not be sent |The browser will return an error
PUT, DELETE, PATCH Preflight request6 | Outgoing request will be sent, If the server allows to do CORS| JS can read the response only if the server returns the right CORS headers. Outgoing request will not be sent |The browser will return an error Outgoing request will not be sent |The browser will return an error
some cases with POST, GET, HEAD. For example, if custom headers are used, or content type is been application/json. Read more in 5 Preflight request6 | Outgoing request will be sent, If the server allows to do CORS | JS can read the response only if the server returns the right CORS headers. Outgoing request will be sent | JS can't read response Outgoing request will not be sent |The browser will return an error

Credentials

Credentials are Cookies and HTTP Authentication include - the browser will send credentials. About cookies see same site mode 202304302357011 Same site Cookies same-origin - the browser will send only if the request to the same origin omit - the browser will not send credentials

Embed image from cross-origin site

SOP doesn't block getting response in embeded html, for example using tag img 

<imp src="notOriginSource">

Form submit with cross-origin action

SOP doesn't block getting request when embeded form submitted 

<body onload="document.forms['csrf'].submit()">
<form action="notOriginSource" name="csrf">
</form>
</body>

Rules for server

How to allow cross-origin access

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

Using Cross Origin Request Sharing (CORS) headers Example: 

Access-Control-Allow-Origin: https://foo.example
Access-Control-Allow-Methods: POST, GET, OPTIONS
Access-Control-Allow-Headers: X-PINGOTHER, Content-Type
Access-Control-Max-Age: 86400

đź’ˇBrowser will not send credentials if Access-Control-Allow-Origin is "*".

Why is SOP not enough to protect target site(site1)

(-) An attacker in some cases can execute request, without reading response (-) An attacker can read response using embeded img

Example SOP error

Pasted image 20230430234534.png

References

  1. web200.Cross-Origin-Attacks.Same-Origin-Policy
  2. https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy
  3. web200.Cross-Origin-Attacks.Cross-Origin Resource Sharing (CORS).Response Headers
  4. web200 p 157
  5. https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
  6. https://developer.mozilla.org/en-US/docs/Glossary/Preflight_request