CODEWITHSUNDEEP
javascriptcross-domainrpc
xiaohan2012
xiaohan2012

Reputation: 10342

Use easyXDM to modify the content of the provider page

I am trying to use easyXDM javascript library to achieve some cross domain hack.

Some background on easyXDM. We have two roles:

  1. the provider, which provides the function to be called by others
  2. the consumer, which calls the function provided by provider.

The requirement is like this:

The consumer passes the content as parameter and calls the function through RPC. 
The provider receives the request and use the content to modify its page.

Here, modifying its page means trying to modify the DOM structure or the content in the DOM node.

The code for the provider side, which will modify its page content once requested by the consumer.

var provider = new easyXDM.Rpc({}, {
    local: {
        modifyContent: {
            method: function(content){
                // modify the content on my page
            }
        }
    }
});

The consumer side, which will perform RPC to ask the provider to change its page.

    var consumer = new easyXDM.Rpc({
        remote: "remoteUrl"
    }, {
        remote: {
            modifyContent: {}
        }
    });
    //perform RPC and ask the provider to the modify its content
    consumer.modifyContent("This is some content that should be used to modify your content");

All things go on well excepts when the provider tries to use the content to modify its page.

No errors nor warnings are raised. But the page just won't change as expected.

Besides, I run the "change content" code alone(like copy&paste&run in Firebug console or Chrome console), it will work.

Has anyone used easyXDM before and encountered this problem?

PS: easyXDM seems not to be a tag here. Please add it for me if you agree it deserves.

Upvotes: 1

Views: 1158

Answers (1)

Brian Shotola
Brian Shotola

Reputation: 472

I ran into the same issue, and the problem was that I didn't understand how easyXDM's RPC functionality worked.

The problem for me was that I was adding the child iframe to the parent and then calling easyXDM.Rpc() with the url of the iframe I added to the page. When I would send a message from the parent to the child, the child would receive the message just fine (and console log the correct message) but I was not able to change any local content or global variables in the child iframe. What I didn't understand is that when a new RPC client is created in the parent that the tool automatically creates an iframe. I thought that it would just use the iframe that I painted on the page. So I was logging from one iframe (which by default is painted off screen) and interacting with an iframe that wasn't wired to the RPC call.

To fix the problem, I removed the iframe that I had added to the page and used the "props" property of the RPC config to make the iframe visible on the screen. Once I did that, everything worked well.

Upvotes: 4

Related Questions