javascript - Using easyXDM to communicate between parent document and child iframe loaded from a different domain (amazon) - Sta

admin管理员组

文章数量:1342533

I'm trying to use easyXDM to municate 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 municate 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,

I'm trying to use easyXDM to municate 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 municate 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,

• javascript
• html
• iframe
• cross-domain

Share Follow asked Dec 28, 2011 at 21:00 ivymikeivymike 1,59122 gold badges2222 silver badges2727 bronze badges 2

• I have the same confusion.Have you solved this problem? – xiaohan2012 Commented Jan 13, 2012 at 15:23
• 1 nope :(. I found another simple wrapper around postmessage which uses location hash for older browsers and postmessage for newer browsers. As an added advantage, the code is tiny and easily understandable unlike the easyXDM labyrinth. The code is here: onlineaspect./2010/01/15/backwards-patible-postmessage – ivymike Commented Jan 13, 2012 at 20:59

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

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./oyvindkinsey/easyXDM

本文标签：