Im having a strange issue only in safari browser, im calling a parent window's javascript function from within a child iframe.
Initially the iframe's src will be an external site which will redirect to my site after the work is done. The redirect page contains the following three lines of code.
This seems to work in all browsers except safari.
The only call within the iframe is
<script>
self.parent.PARENT_FUNCTION("param");
</script>
Ive tried several other ways instead of self.parent like top.PARENT_FUNCTION,etc but still the main window's location seems to change.
One thing we noticed is that while the redirect is happening within the iframe, im getting a security certificate warning, once I clieck continue, then the browsers location changes to the new redirect url instead of just the iframe's src.
any clues what could the issue be ?.
Apparently the issue is with safari browser and invalid security certificate of the site within the iframe.
It basically does a frame busting and changes the main window's url if the site within the iframe is having an invalid ceritificate.
Related
So I've read about the HTML5 sandbox property and I understand that if I want to prevent an iframe redirect its parent window I can use the sandbox property leaving allow-top-navigation out. However when this is done, if the iframe was originally relying on top level redirection, what happens in its place is that it redirects to a blank page, effectively breaking navigation.
Can I prevent the iframe from tinkering its parent window while still allowing "top level" redirects, only letting these work within the context of the iframe instead of being top level?
Edit: For context, I'm working with a third party and its page has a form with a target _top. If the iframe is sandboxed, upon submitting the form users get a blank page, if it's not sandboxed the entire page is redirected. I'm looking for something that would allow to submit the form and show the result within the iframe itself.
With HTML5 the iframe sandbox attribute was added.
At the time of writing this works on Chrome, Safari, Firefox and recent versions of IE and Opera but does pretty much what you want:
Allows the iframe content to be treated as being from the same origin as the containing document
<iframe src="url" sandbox="allow-same-origin"></iframe>
Browser Compatibility
Some Useful links
w3schools for sandbox
developer.mozilla.org iframe
-
You can use the onbeforeunload property and determine if you wan to redirect or not.
Here is the docs page for it
Basically what I would try is this:
Make a function that adds the sandbox attribute with everything, just leaving out the allow-top-navigation, to the iframe
Bind a function to the onbeforeunload property of the iframe that calls the function that adds the sandbox attribute (be sure not to return anything because a dialog will pop-up)
This should work because the request is made in the iframe first, and then we can prevent it from carrying over to our top level window.
Another thing you should check is if you maybe left out the allow-formsoption, which can cause what you are describing.
Please let me know if any of this worked.
I have the following pages on same domain:
/A/p1.html
/B/p2.html
/B/p3.html
p1.html contains an IFRAME showing p2.html. p2.html can also run alone (as a top-level document). Eventually, p2.html runs the following JavaScript statement:
document.location.href = 'p3.html';
If p2.html is a top-level document, it works fine. Chrome sends the user to /B/p3.html.
Now if p2.html is an IFRAME inside p1.html, then Chrome sends the IFRAME to /A/p3.html, giving a 404 error. I want Chrome to put IFRAME on /B/p3.html, since p2.html is already on /B/.
How can I make relative URLs work both from inside an IFRAME and also as a top-level document?
This works on FireFox, so it's definetly a Chrome bug. https://code.google.com/p/chromium/issues/detail?id=357988
My main page is from "DomainA" and I have an iFrame within that from "DomainB". The page within the iFrame has an onclick event to open a window, also from DomainB.
I'm trying to update an input field inside the iFrame from the opened window using:
window.opener.document.getElementById('foo').value = 'bar';
This works fine in FF, however in IE I get the error: SCRIPT70: Permission denied
It seems like I'm getting blocked because of the Same Origin Policy, but the page that opens the window, and the opened window are both from DomainB.
I'm using a relative URI within window.open(). Is IE determining domain from the parent of the iframe?
How can I get around this?
Turns out another developer had added the follwing line inside one of the scripts:
document.domain = 'bla.com';
This was causing that behaviour. Please disregard, thx.
Is it possible to generate dynamic content inside Iframe? if yes , how ? I'm having some problems with IE, thank you
UPDATE :
I'm creating a modal window which plays video, but when I close it it remains playing in IE7 although its hidden but it firefox it stops playing as it should. So I just wanted to try with iframe, thinking maybe that will solve my problem :)
As #Aaron already noted, you can use everything you use for normal pages in your iFrame.
Noteworthy however is that the content in the iframe is an isolated page.
No code from your parent page can access anything in the iframe's page.
This is a security measure that prevents Evil People from showing you trusted pages with custom javascript hooks attached.
An iframe is just like any other HTML window, so yes, you can generate dynamic content.
To create content use the normal syntax:
var div = iframe.document.createElement("div");
Please include a description of what exact problem you face. Otherwise, we can't help much.
[EDIT] Note that the URL of the document in the iframe must contain the same domain or the Same Origin Policy will prevent the access.
As for your problem with the modal window: Are you saying that the window doesn't close? That sounds like a IE bug :/
The scene: I'm writing an embeddable widget. It takes the form of a <script> tag, which builds an iframe containing everything it needs to display. The iframe has no src, and the script writes to it with theIframe.contentWindow.document.write(). This keeps the widget contained, and keeps element ids and script from conflicting with the page on which the widget is embedded.
The trick: The widget has to be able to change its size. To do this, it sets its containing iframe's style.height. This requires access to the outer page's DOM. In Firefox and IE, this is allowed, because the iframe's document and the outer document are considered to share an origin.
The twist: In Safari, however, the two documents are considered not to share an origin. The inner document is considered to be at about:blank, while the outer document is clearly using a different protocol and "domain" (if blank can be considered the domain).
The question: How can I build an iframe programmatically whose document Safari/WebKit will consider to have the same origin as the document of the window creating it?
Edit: After further experimentation, I can't find a way to programmatically create an iframe whose location is not about:blank regardless of whether I change its contents.
If I create the frame with document.createElement(), give it a src which points to a real HTML resource on the same origin called "foo.html", and document.body.appendChild() it, Safari's console shows the element as expected in the DOM, but the contents of the page do not appear, and the document is listed in the sidebar as "about:blank".
If I include the HTML for the iframe directly in the page, the contents of foo.html appear, and "foo.html" appears in the sidebar.
If I insert the HTML using document.write(), I get the same result as with document.body.appendChild().
Both programmatic versions work in Firefox.
The best suggestion I could give is to have the iframe set to a blank page on the same server (ie blank.html) and then edit the content. A pain in the rear, I know but it's a workaround.
You could also try
iframe.contentDocument.open("replace");
iframe.contentDocument.write("<b>This is some content</b>");
iframe.contentDocument.close();
However, I'm not sure if that only works in IE. Sorry I couldn't be more helpful than that.
Aha. This seems to be a bug in WebKit. When an iframe is created programmatically, its src attribute is ignored. Instead, the frame defaults to about:blank and must be directed to a URL to point elsewhere. For example:
theIframe.contentWindow.location = theIframe.src