HTML5 way to call parent JavaScript function from iFrame - besides using postMessage? Or a solution for PhoneGap applications?

Question

We are aware of the cross-domain limitations associated with cross-window communication and the implementation of postMessage in HTML5.

However, we are wondering if there are other ways in which an iFrame can call JavaScript functions defined in its parent window.

We find postMessage a bit awkward to call multiple methods, each of which requires several parameters.

If HTML5 alternatives do not exist, bonus points for offering a solution in PhoneGap.

More on PhoneGap:

Embed the iFrame in the PhoneGap "index.html" page.

From "index.html" we can call JavaScript functions or access variables in an iFrame.

But we cannot call functions or access variables in "index.html" from an iFrame.

Is there something in PhoneGap that prevents this from working the other way around?

Thanks!

Answer 1

An alternative to postMessage is the hashtag of the URL. It is not difficult to encode more complex messages in a JSON message and encode / decode text:

{"methodName": ['a', 'b', 3]}

It becomes: #% 7B% 22methodName% 22% 3A% 20% 5B'a '% 2C% 20'b'% 2C% 203% 5D% 7D

If you have a script, on the other hand, watching for a hash change and message processing, you should go.

Note that the same trick can work fine with postMessage in browsers that support it. A popular way to do this is to use postMessage and get back to modifying the hash.

Answer 2

parent.funcitonName(args); works great for me. I'm not sure if there are cross-domain problems, though, I am doing all my iFrame codes in the same domain.