While hacking around with easyXDM recently, I learned a few things I thought were worth noting/sharing. I wanted to replace something like a jQuery ajax call, eg
$.ajax({"url":"http://localhost/resource.json", "success":function(data){...}})
with a cross-domain equivalent, but it wasn’t immediately obvious where/how easyXDM would fit in. It was all in the documentation (see the code sample in the shipped /cors/ interface section of the readme file), but not phrased in the way I expected. Here are the steps I went through to get it working:
- Upload the src/cors/index.html easyXDM support file to the domain I wanted to make available to cross-domain requests. For example, I wanted localhost to be the provider of data, so I made the file available at http://localhost/easyXDM/src/cors/index.html.
- Edit src/cors/index.html file to set useAccessControl to false, eg
var useAccessControl = false;
. The code comments state that this stops the code from using response headers to determine access control. Setting this to false seems like a bad idea, but it’s what I had to do to get it working. I definitely want to learn more about how to establish access control safely. - Edit src/cors/index.html file to pull easyXDM.debug.js and json2.js from the provider’s domain
- Wherever I wanted to make an ajax call, I needed to include easyXDM.debug.js and json2.js, and then drop in this code:
var rpc = new easyXDM.Rpc({ remote: "http://localhost/easyXDM/src/cors/index.html" }, { remote: { request: {} } }); rpc.request({ url: "http://localhost/resource.json", method: "GET" }, function(response){ console.log(JSON.parse(response.data)); });
Here are some resources I found helpful:
- The easyXDM source code: https://github.com/oyvindkinsey/easyXDM
- The easyXDM XHR example: http://consumer.easyxdm.net/current/example/xhr.html
- Øyvind Sean Kinsey’s Cross-Document Messaging and RPC article
To conclude, if you you’d like to learn more about honey badgers, and you don’t mind profanity, this is worth watching: