Setting iFrame src attribute as encoded data URI with javascript in chrome

From my research it looks like this has been deemed a security risk and so is disallowed in all browsers.

MS IE site link excerpt:

Data URIs are supported only for the following elements and/or attributes.

  • object (images only)
  • img
  • input type=image
  • link
  • CSS declarations that accept a URL, such as background, backgroundImage, and so on.

HTML5 Security Cheatsheet: http://html5sec.org/


Use the srcdoc attribute instead, you can just whack raw HTML in it.

Demo

<iframe srcdoc="<h1>HELLO</h1>"></iframe>
<iframe id="dynamic"></iframe>
<script>document.getElementById('dynamic').srcdoc = '<i>there</i>';</script>

Works in everything except the MS browsers.
Use sandbox to make it more secure.