Solving CORS issues like a racoon 🦝


What is window.postMessage?

Its an HTML5 spec where one window can communicate with another window if

  • other frames or iframes within the sender document’s window - windows the sender document explicitly opens through JavaScript calls - the parent window of the sender document - the window which opened the sender document

by doing otherWindow.postMessage(message, targetOrigin);

Firstly, iFrames were never made for CORS, but iframes can be used to make a CORS origin request with postMessage.

We insert an iFrame with src into the client’s page/window.

{% gist 7090130 %}

And on the, you have the a ‘message’ eventlistener waiting to respond to requests.

Here we don’t have any issues with number of requests/page, and is much simpler to handle and debug.

iframe postMessage example