Toggling iFrame Sandbox

Question

I'm trying to figure out if it's possible to programmatically change the value of sandbox for an iFrame.

From MDN iframe:

When the embedded document has the same origin as the main page, it is strongly discouraged to use both allow-scripts and allow-same-origin at the same time, as that allows the embedded document to programmatically remove the sandbox attribute. Although it is accepted, this case is no more secure than not using the sandbox attribute.

However, changing the attribute in the parent does not successfully trigger sandboxing as that would imply in the child.

document.getElementById('myFrame').setAttribute('sandbox', 'allow-scripts');

The page loaded in that iFrame can successfully gain access to the parent, which would not be the case if sandboxing was working. The attribute does change, but the security is flawed as it does not prevent access to the patent.

console.log(window.parent.document);

The above still works in the iFrame which had the sandbox "programmatically" enabled. This is the case in both Chrome and Firefox, which would imply either intended undocumented functionality or a poorly implemented specification.

Anyone have any ideas on what would be the appropriate expectation?

Answer 1

Please try this fiddle : http://jsfiddle.net/yAwxy/ It's not working when the script is runned onLoad b/c the iframe is already working. If you try onDomready, the sandboxing is applied b/c the script didn't run yet. If you log using this fiddle:

<iframe id="myFrame" srcdoc="<script>console.log('Executing script inside iFrame')</script>">
</iframe>

And in the script

console.log('Executing script inside page')

When the script console.log('Executing script inside page') is wrapped onLoad, the outpu is :

Executing script inside iFrame 
Executing script inside page 

And when wrapped onDomready :

Executing script inside page 
Executing script inside iFrame 

See also http://jsfiddle.net/yAwxy/1/.

So to change the rules, they must be changed OndomReady

Answer 2

I am running into similar issues when trying to dynamically create iframe contents in Internet Explorer inside of a sandboxed iframe. I tried doing the same thing you did with using javascript to add the sandbox attribute after the iframe was already created and content placed in the iframe (using a javascript: URI in the src= attribute) but the iframe appears to keep it's attributes that were present at the time of being loaded in the page.

Internet Explorer does appear to work differently than FireFox or Chrome when it comes to applying the sandbox attribute. Chrome and FireFox will allow the contents to be dynamically created using src=javascript:function() when the sandbox="allow-scripts" is set. IE appears to apply the unique domain from the sandbox attribute during creation and considers src=javascript:function() to be not-same-origin and will not allow the dynamic creation of the iframe contents.

I am not sure why you are trying to add the sandbox attribute programmatically, but if it is an issue of trying to just load an iframe with dynamic source you can use the srcdoc attribute as well as the sandbox attribute with the only issue being that IE does not support the srcdoc attribute.

To answer your question, I do not believe it is possible to load an iframe and its contents and then add the sandbox attribute after the fact and have the iframe behave as a sandboxed iframe.