Sending events to an iFrame on a different domain? - javascript

I've run into the problem where the contentDocument on an iFrame is not accessible to me because it's on a different domain, but I need to find some way to send touch events to elements within this iFrame in a UIWebView.
Basically the user can access pages like this one, and due to the user being unable to click on these manually (UIWebView is on a second screen using AirPlay mirroring) I need to be able to send click/touchstart/touchend etc events to elements on whichever page the user is accessing.
Is there any way to do this at all with Javascript? If not, is there any way to somehow extract the iFrame within UIWebView to get around this limitation?

You can do this using the postMessage API:
https://developer.mozilla.org/en-US/docs/Web/API/Window.postMessage
You will have do incorporate a messaging system between the two windows, handle the events to do what you want, you won't have DOM access, but you should be able to do that via events that trigger handlers in each window.

Related

JSP trigger onclick event programmatically

I have a device, which uses JSP to create the webpage, to maintain itself. There are some onclick events, and I would like to get some information from this device via a stand alone application, which only connects via IP to this device, and get all the information.
So, is it somehow possible to get directly to the functions, which are normally triggered via onclick events, so that non-human programs can open these pages?
Thank you

How can I use postMessage to share data between top level windows?

Using Web Messaging (postMessage), it's easy to send messages between windows including iframes and popup windows opened through Javascript. However, is it possible for two windows opened individually by the user to find each other and communicate?
As an example, if the user opens www.example.com/app.html in the browser, then the same page in another tab/windows of the same browser, I want the second window to know that it should act as a "child" of the first one and exchange a stream of events via postMessage. How do I detect the presence of another open window and how to I get a handle to it that I can use with postMessage?
i don't know if it's possible with postMessage.
but, it should be possible with localStorage or sessionStorage (which lives in the session scope).
using this approach you can write a value in one window/tab, and read it in the other window/tab, of course assuming that it's all on the same domain.
see more here: http://php-html.net/tutorials/html5-local-storage-guide/
hope that helps.

How to set focus to top frame within an iframe crossdomain.

I have an iframe in my web-page. So when Esc is pressed inside the iframe I need to set focus the top frame of document. The iframe is from an different domain.
Here Frame-B URL will be some abc.com and frame-A will be from xyz.com
So when an event is fired in Frame-B I need to focus Frame-A.
I can bind any number of events in Frame-A and Frame-B.
I have found a old way like this "An iframe in an iframe in an iframe". which am not interested in.
Any Idea how this can be done?
If you have some control over the outer frame (let's say it's your site, but still a different one than B), then there's a number of solutions to your problem. If you don't have any control over the outer frame, (because it is google.com for example) then there's nothing you can do. The browsers are designed to prevent it. See Jonas answer.
So what about if you can control the outer page? Any of the following would work:
Use postMessage. All you have to do is adding an very generic event listener in Frame-A. It's available in "all" browsers except IE7 and below.
Use a server as a middleman. Send a request from Frame-B to your server and let Frame-A access it from there. If you don't want to poll, you could use web sockets in Frame-A (or rather a good web socket lib, that fallbacks on other technologies if web sockets are not present).
Use the fragment identifier hack. You can read about that (and several other techniques) here: http://softwareas.com/cross-domain-communication-with-iframes

Running a bookmarklet on an iFrame that is coming from a different domain

Is there any way to run a bookmarklet on an iFrame which is from a different domain?
For example, I have a page loaded from http://example.com, which has an iFrame whose source is set to http://example2.com. When I run the bookmarklet, it is always run on http://example.com, since that is the main page. I want to run it on the other iFrame though.
When I attempt to interact with the iFrame (e.g. by changing its source attribute to javascript:alert('test')), Chrome shows the following error:
Unsafe JavaScript attempt to access frame with URL http://example.com from frame with URL http://example2.com. Domains, protocols and ports must match.
I tried dragging and dropping the bookmarklet into the frame, but it says:
Failed to load resource
Is there any way for me to interact with an iFrame using a bookmarklet in Chrome?
There is a way to do cross-domain message-passing (not arbitrary code execution) using window.postMessage, yet all a frame A can do to frame B (when they are not of the same origin) is passing it a message hoping that B has a callback function listening for this message.
So here if you control exemple2.com (what's in the frame that don't get the bookmarklet), you can make the bookmarklet pass a message to the iframe and handle it in the iframe.
Else I don't think you have a solution here, except very complicated ones (like proxying).
Other links:
In-depth article about same origin policy and its implementations in browsers
A cross-browser, backward compatible postMessage attempt (as jQuery plugin)
iFrames have alot of security on them as do ajax calls.
Any attempt to use these in a cross-domain manner will result in a security error.
Imagine you were able to interact with other iFrames on different domains. You would be able to make an iFrame (like facebook login's page) that had width and height of 100% and add a function to execute on a submit event which would email you the username and pass before submitting.
So you're gonna have a lot of trouble accomplishing what you're trying to do. You basically can't mess with a page that you don't own. You can use firebug to edit it with the html tab though.
Hope that helps
One option if you are not in control of the page or the iframe is to load the iframe into a new window. The src attribute of the iframe is available to read by the parent JS, which can then open a new tab or window. The user can then click on the bookmarklet a second time to load it into this new page.

monitoring iframe content/status from the parent page

What methods are available to monitor the status of IFRAME page, I know there are security limits but I hope some small notification system is still possible.
My situation is that I have created a parent page that is located on customer's server, and this page has has iframe page located on my server (my domain). I need to somehow communicate a little between these two:
Can I make javascript to the parent page that can check if my iframe page has a specific string on it, or somehow make iframe page to notify the parent page?
Is there e.g. any possibility to make a timer that checks iframe content time to time?
I also accept answer how mydomain/client.page calls callback on customerdomain.intranet.com/parentpage.htm that has client on iframe
You need to use cross site JavaScript techniques to be able to do this. Here is an example.
Put another file into your server, call it helper.html, include it to your file served by customers server using an iframe. Set the src of the helper.html iframe with adding get parameters, ie. http:/myserver.com/helper.html?param1=a&param2=b, in the helper file use javascript to call method on parent's parent ( parent.parent.messageFromIframe(params) ). Which is the page on your server itself. Since helper and the container page are on the same domain it should work. The technique is popular, for instance Facebook was using it for their Javascript api.
I got information that this is possible by setting parent.location (from iframe) to have hash data like this "mydomain.com/mypage#mymessage"
By default, security restrictions in the browser will prevent access from/to the document in the iframe if it is in a different domain to the parent page. This is, of course, just as it should be.
I believe this would prevent even checking the current location of the iframe, but that's easily testable. If it's accessible, then you could poll the iframe for its location, and whenever the page in the iframe updates, have it append a random querystring parameter. Comparison of that parameter to the value from the previous poll would tell you if it's changed.
However, as I say, I suspect it's not possible.
Edit: This question suggests it is only possible for the initial src attribute: How do I get the current location of an iframe?

Categories