Cross-Site Scripting - (HACK) a way out

I came across to this discovery when i was affronted with the problem of trying to communicate TWO sites on different domain/server and some parameters need to be passed. As you may have “Googled” it, you can’t do outright javaScript function call from your site to a partner site since it resides on different domains. It’s a violation of the Cross-Site Scripting W3C standards for it is highly probable for site security breach.

To make the picture clearer, here’s the scenario. Take for an example your site caters a hotel reservation and you have a partner seller that also maintains a site for marketing. If you want to maximize you potential sales, you’ll opt to let your partner embed/include your reservation site somewhere in their site.
See the diagram now? Partner site e.g resides in www.marketing.com and your site in www.hotelreservation.com, without directly accessing your site, a customer must be able to get a hotel reservation on you partner site. There the problem on how to implement it.

You’re probably going out of your wits trying to figure this out. Many have resulted to go beyond this restriction and rely communication through technologies such as Webservices, Soap, Rest, and the like.

But the big question is what if you can’t afford to build such extravagant service for a small functionality that you want to achieve? Would you rather abandon the idea?

Hold still, there’s still a way out.

The following is a a sample demonstration on how you could pass simple non-high-risk data from your site to your partner site.

Ok, so normally your marketing partner will embed your site in an IFRAME this will act as a widget of your site. Now once the customer clicks and send reservation request through the embedded widget, it must show your reservation site in full and entered values must be passed and kept.

HOW TO

1. Inside the partner page where your “widget” will be embedded, implement the script below.

var lastHash = \"\";
function checkForLocationHash(){
   if(location.hash != lastHash){
      lastHash = location.hash;
      widgetScript(location.hash);
    }
}
setInterval(checkForLocationHash, 200);

2. Implement a method that will do the processing of the passed values and that will show the your reservation site.
e.g.

 function widgetScript(obj){
     var data = obj.replace(/%22/g,\"\\"\");
     var indexOfData = data.indexOf(\"#\") + 1;
     var jObject = data.substring(indexOfData);
	
     window.location.replace(\"www.hotelreservation.com#\" + jObject );                                       
	
}

3. In your widget page (reservation site) implement the object binding and location hash manipulation. Implement this script onClick / onSubmit of reservation.

      var  JSON_OBJECT = \"{\"object_test\" : \"This is a test!\"}\";
       parent.location = \"www.marketing.com#\" +   JSON_OBJECT;

***NOTE: parameter after the HASH tag must not necessarily be a JSON Object. You can use simple value-pair parameters.

The line

       parent.location = \"www.marketing.com#\" +   JSON_OBJECT;

is the key. See how the parameters are being passed through the hash tag. Without using the POST / GET method, the reservation page (IFRAME) was able to pass values to its parent page which is what we just need.

Now the last part is

4. www.hotelreservation.com must implement a method similar to Step 1 and manipulate the string after the hash tag.