Question

I’m trying to use easyXDM to communicate between parent document and child iframe (loaded from a different domain – amazon). The iframe src is an oauth signed url and has the following code to communicate with the parent document that loads it:

socket = new easyXDM.Socket({
    remote: "http://localhost:56789/hitch.html", /* parent document */
    remoteHelper: "http://localhost:56789/easyXDM/name.html",
    onMessage: function(message, origin){
        alert("Received '" + message + "' from '" + origin + "'");
    },
    onReady: function() {
        socket.postMessage("Yay, it works!");
    }
});

the above code is kept in the head portion of the document.

In parent (hitch.html):

var transport = new easyXDM.Socket(/** The configuration */{
    local: "/easyXDM/name.html",
    swf: "/easyXDM/easyxdm.swf",
    onMessage: function(message, origin){
       transport.postMessage("This is a message received from " + location);
    }
});

When I load the child iframe from amazonS3 inside the parent document, easyXDM is creating another iframe inside the child iframe with src set to “http://localhost:56789/hitch.html?xdm_e=…” . This causes the whole thing to be repeated in a cycle – with parent again trying to load the child iframe and so on.

I’m testing on Firefox 9.0 which has postMessage support. The actual messages are being sent properly and I can see the message boxes. Other than this, it also throws a “url is undefined or empty” error in parent document when initializing easyXDM.socket but it doesn’t seem to affect anything else…

Thanks,

Answer 1

I think you’ve just got the logic backwards. The documentation says quite clearly:

“When using easyXDM you first load the consumer document and then let
easyXDM load the provider.”

The “consumer” is the parent document, and easyxdm loads the “provider” which is the child iframe.

ref – https://github.com/oyvindkinsey/easyXDM