Search code examples
javascripthtmliframesandbox

HTML5 Iframe: Block remote requests

I am loading HTML content into an iframe using the srcdoc property. The iframe is a sandboxed iframe with no permissions given, so all Javascript in the iframe is blocked. However, remote requests (such as for CSS, images etc.) will still be triggered inside the iframe.

Is there any possible way to tell the iframe to only load what I give it in the srcdoc property and not make any additional requests?

Thanks in advance

Solution

  • The basics

    Presumably no because sandboxing the iframe is meant to avoid sharing sensitive data between your main document and your iframe's document or limiting potentially disruptive behavior.

    The iframe is still functionally a browser window and will act like such, loading all external resources that are declared in it, with the only difference that it displays within another document rather than another window.

    If the code present inside srcdoc has calls to remote resources, then the browser is doing exactly what you are telling it to do by loading them.

    If you don't want these resources to be loaded, you will have to edit them out of the srcdoc code.

    Actually, a possible solution

    That being said, there might exist a way to block the loading of resources by using a Content Security Policy from within the iframe's document using a meta tag:

    <meta http-equiv="Content-Security-Policy" content="default-src 'none';">

    or

    <meta http-equiv="X-Content-Security-Policy" content="default-src 'none';">

    I did try this under Firefox 39.0.3 but it didn't work, likely because of the following:

    Bug 663570 - Implement Content Security Policy via tag

    Regardless, for more information, see: