Bypassing methods of Same-origin policy

Cross-origin resource sharing (CORS)

Cross-origin resources sharing (CORS) is the main technology that allows one origin to access resources from another origin. To do this, the server that allows access to its resources must specify the HTTP-header Access-Control-Allow-Origin and list the origins that are allowed to access it through a space.

Access-Control-Allow-Origin: http://a.com https://b.com

It is possible to allow access to any origin by specifying the value * (wildcard), which is 99% error and valid only for libraries, such as Google Maps. If you specify Access-Control-Allow-Origin: *, the browser will not send the user's Cookie in time of resource loading.

JSON with padding (JSONP)

Since Same-origin policy does not prevent Javascript from connecting via the tag <script> from another origin, then there you can find an opportunity for data transfer.

Another origin wants to transmit user data via URL http://domanin2.com/customer/42. The source (domain1.com) that requests data can connect Javascript to this address

<script
    type="application/javascript"
    src="http://domain2.com/customer/42">
</script>

At the same time, an HTTP request will be sent to the domain2.com server with a cookie from domain2.com. But the server can not return JSON (Javascript object), it will cause a compilation error, so the server's response turns into some Javascript function (callback), which is defined on the source (domain1.com) origin. The server response might look like this

responseCallback({
	"id": 42,
	"isActive": true,
	"email": "email@domain.tld"
})

If another origin is compromised or does not have a sufficient level of trust then the answer can be any Javascript code, including destructive nature.

Window.postMessage() API

Web Messaging API provides the opportunity to communicate two documents from different origins. It can be two web browser windows, or a document displaying an iframe from another origin.

The first origin uses the postMessage function to pass data, whose arguments are the message and the destination origin.

var receiver = document.getElementById("iframe1").contentWindow;
receiver.postMessage("Security is simple!", "http://another.origin");

The receiving origin sets the message handler and can return the requested data in response.

window.addEventListener("message", receiveMessage);
function receiveMessage(event) {
	if (event.origin !== "http://domain1.com") {
  		return;
	}
	console.log("Received data: " + event.data);
	event.source.postMessage("Yes!", event.origin);
}

In the case of the Window.postMessage API communication goes not directly between the the client's code (Javascript) and the server. It goes between the client code which, if necessary, can send a request to the server.

  Content Security Policy →