Lets say I wish to execute a html/css/JS page disallowing any content being loaded from outside sources. Beyond that everything should be allowed.
Some examples
HTML
<a href="http://www.google.com">Clicking this link would somehow fail</a>
<iframe src="http://www.google.com">Would not load</iframe>
CSS
body{
/* would show no background */
background: url('http://www.google.com/google.jpg');
}
JavaScript
// Despite access-control-allow-origin: * being set on the external
// resource it would error out.
httpRequest.open('GET', 'http://www.allowscrosorigin.org/', true);
// Should not do anything
location.href = "http://www.google.com";
I was hoping first that the sandbox attribute on <iframe>'s would allow this, but it turns out not to be able to do this. Next been looking into CSP, which I think would be able to get the CSS and AJAX part covered, but can't stop information from leaking through for example an iframed auto clicked link or location.href. So, are there any alternative ways to get this working all together? Or could this maybe be achieved with Google Caja (I would prefer not having to rewrite everything automatically, but if there are no other options then I am open to that as well)?