I am having trouble capturing an event when a form submits.
I am dealing with a third party iframe over which I have no control, and when the user clicks a submit button there, it calls a javascript function that does a form.submit() in javascript with:
target="_parent".
This third-party iframe is also inside a nested iframe.
Since this encompassed html javascript and different documents, I tried to represent it as best I could:
pseudocode:
[page mydomain.com/main]
[iframe mydomain.com/inner-frame]
<script type="text/javascript">
window.onbeforeunload = function(){
alert('trying to submit');
}
</script>
[iframe third-party-iframe.com]
<form action="mydomain.com/form-action" target="_parent" method="POST">
<input type="submit" />
</form>
[/ third party iframe]
[/iframe]
[page]
The problem is that it seems like the form submit event isn't captured consistently in the parent document.
I need to know this so I can do something after the form is submitted.
In firefox, the onbeforeunload event fires, but in chrome it doesn't and it seems to error out with an "Unsafe JavaScript attempt to access frame" before any events are fired.
Also strange is the fact that the form submit doesn't submit to the parent of the iframe, it just opens a new tab with that url (form-action.php in my example).
Can anyone shed some light on what this behavior is? I'm not even sure if this behavior (no events fired, new browser tab) is a function of the javascript, the iframes, or of the browser.
Also, what is the correct event to listen for when you have a _parent submit? And where to listen? I am assuming that _parent refers to the direct parent of the frame.
===================================
UPDATE:
I mis-stated the problem, but I figured out why it wasn't working:
In fact the code looks more like this:
pseudocode:
[page third-party-site.com]
[page mydomain.com/main]
[iframe mydomain.com/inner-frame]
<script type="text/javascript">
window.onbeforeunload = function(){
alert('trying to submit');
}
</script>
[iframe third-party开发者_如何学C-site.com/iframe]
<form action="mydomain.com/form-action" target="_parent" method="POST">
<input type="submit" />
</form>
[/ third party iframe]
[/iframe]
[page]
[/page]
I was looking at the page outside the first iframe for debug reasons, so I am hypothesizing that the form at third-part-site.com was attempting to redirect something inside mydomain.com, and the browser was blocking this child third-party iframe from re-directing the parent.
When I put mydomain.com back in it's own iframe where it will be in production code, the browser no longer blocks this redirect- it appears that this is caused my a cross-domain issue, because the code doesn't work when I try to set a localhost iframe containing mydomain.com. The browser looks like it wants the top parent domain to be the same as the inner-inner-inner iframe domain.
This would suggest that the _parent form attribute doesn't refer to the contextual parent, it refers to the top parent? (although the event capture happens in that iframe's direct parent...) maybe it will always bublle all the way up?
btw, if anyone cares to know, this is a facebook app, it's a canvas page that contains an iframe that has a multi-friend request selector inside.
I'm researching a similar problem and came across the following article on Clickjacking that contained this interesting bit of trivia:
However, if the attacker encloses the victim in one frame inside another (a double frame), then accessing parent.location becomes a security violation in all popular browsers, due to the descendant frame navigation policy. This security violation disables the counter-action navigation.
The "descendant frame navigation policy" seems to place some limits on what descendant frames can do to parent frames.
I know that this does not answer the question, but perhaps it will shed light on the issue. But perhaps not. Just wanted to share.
精彩评论