Html5detect v0.1

I recently worked a fair bit with some of the new features in HTML5. If you haven’t played with them yet please don’t get your hopes up. Although a standards sounds nice, the implementation by all the browsers is appalling. </html5-rant>

Anyway, during development I stumbled upon the ‘postMessage’ function. In short, ‘postMessage’ allows you to send messages between frames even if they are hosted on different domains. The function itself is incredibly easy and very useful. Every browser supports sending a ‘string’ to the other frame. A message is send using <target-frame>.postMessage(, ). The target frame defines (or hooks) the ‘onmessage’ event. ‘postMessage’ will only send the message to the defined frame if the domain name is equal to the one defined in ‘targetOrigin’ unless a wildcard is used. Its possible some developers will use this function incorrectly and transfer sensitive data between frames. I also think that some developers will set the targetOrigin to a wildcard. This is usually not a problem unless – in a worst case scenario – the post messaging system is used to comunicate back and forth between two frames. I think it should be possible to exploit this in some cases by taking control over the messages that are being exchanged between two frames. Unfortunately I don’t have a real life example – and i’m to lazy to build one – so if you find one, please do share.

Apart form the possible vulnerabilities that could occur while using postMessage, post messages are a pain in the ass to debug. So I create a small Chrome plugin that will notify you – via an icon in your address bar (see fig. 1) – if HTML5 post messages are received on the current page. All received messages will be printed to the console (using console.log) when this happens.


Fig 1. Chrome address bar when a post message has been detected

The plugin is very basic – I created it in about an hour – but very useful when developing web applications or simply looking for juicy bits on a website.


Cheers, Ruben.