Same Origin Policy and Relaxations

References

https://en.wikipedia.org/wiki/Same-origin_policy

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

https://en.wikipedia.org/wiki/JSONP

Same-origin Policy

Determination of "same origin"

• Only all three elements are same
  • protocol
  • host
  • port

Effect

• Code from origin A cannot request resource from origin B

Relaxing the Same-origin Policy

• Two windows/frames have script setting document.domain property (implicitly set port to null) to same so they can interact
• Cross-Origin Resource Sharing (CORS) - standardized, with "Origin" request header & "Access-Control-Allow-Origin" response header
• Cross-document messaging: window.postMessage() and onmessage - pass text messages to a script on another page
• JSONP (JSON with Padding) - insecure, replaced by CORS
• WebSocket - scripts are permitted to connect to any WebSocket address. "Origin" header will be attached to the request and WebSocket server must compare the header with a whitelist.

CORS

Used for

• XMLHttpRequest or Fetch APIs
• Web fonts
• WebGL textures
• Image/video frames using drawImage
• Stylesheets (CSSOM)
• Scripts

How it works

Simple requests

No CORS preflight, just additional headers. When (1) GET/HEAD/POST (2) only allowed headers (3) only allowed Content-Type (no JSON!) (4) No event listener, ReadableStream

• (CLient -> Server) Origin
• (Server -> Client) Access-Control-Allow-Origin

Preflight Requests

Request with server side-effects require prefligt

• browser preflight the request with "OPTIONS" request
• up approval, sends actual request
• server also notify client whether credentials should be sent