The window.name transport is a new technique for secure cross-domain browser based data transfer, and can be utilized for creating secure mashups with untrusted sources. window.name is implemented in Dojo in the new dojox.io.windowName module, and it is very easy to make web services available through the window.name protocol. window.name works by loading a cross-domain HTML file in an iframe. The HTML file then sets its window.name to the string content that should be delivered to the requester. The requester can then retrieve the window.name value as the response. The requested resource never has access to the requester’s environment (JavaScript variables, cookies, and DOM) Kris Zyp http://www.sitepen.com/blog/2008/07/22/windowname-transport/
You can read the above or grok this: window.name is the only property on an iframe that is not locked down
for xdomain requests. similar to jsonp, if a server returns a script that sets window.name to a value,
that value can be read by the calling page.
Starting with the promise of xdr communication, I started with DojoToolkit's dojox.io.windowName. It works as advertised, but in IE the clicking and spinning is just too much to bear.
Then I google-stumbled into
Between the three of them and a little elbow grease, I arrived at a very simple xdr with no practical data length restrictions (browser JS engines start to throw OOM exceptions at around 10mb of json) that works on all of the 8 browsers installed upon my primary windows development machine.
PROS:
- Quick and clean
- More secure than XHR
- Transparent caching and cookies
- .....
CONS:
- No error feedback except empty data. The server must wrap itself tight and return errors in JSON with a 200 OK
- No headers
- ...
Conclusion:
While the this functionality, whether the simple example I present here or a more refined version such as Dojox.io, ultimately does not meet the requirements for which I spike it, I anticipate that it will come in handy so here is an implementation that you can try out.
window.name.client.htm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
var NameWindowTransport = function(callback) {
/// <summary>Provides, with a little cooperation from the foreign server, cross domain communication</summary>
/// <param name="callback" type="function(data)"></param>
var _callback = callback;
var doc, iframe;
if ("ActiveXObject" in window) {
// IE: we could just append an iframe element but the click and spinner
// would make it unbearable. spin up a disconnected browser and use it
doc = new ActiveXObject("htmlfile");
doc.open();
doc.write("<html><body><iframe id='iframe' scr='about:blank' style='visibility:hidden;' width='0' height='0'></iframe></body></html>");
doc.close();
iframe = doc.getElementById('iframe');
} else {
// for nice borwsers, this is easy
doc = document;
iframe = doc.createElement('iframe');
iframe.style.visibility = "hidden";
iframe.style.width = "0";
iframe.style.height = "0";
iframe.setAttribute("src", "about:blank");
doc.body.appendChild(iframe);
}
iframe.onload = function() {
// data is transfered in window.name
// apparently no size limitations
var data = iframe.contentWindow.name;
// the only error detection is empty data. 8-\
// so wrap your server calls tight and return
// error json in a window.name envelope
if (data && _callback) {
_callback(data);
}
};
// would be on prototype in a production script, but this is simply a POC for
// proposing integrating the less annoying ActiveX hack into Dojox.io
this.beginRequest = function(url, callback) {
_callback = callback || _callback;
iframe.setAttribute("src", url);
};
}
// unlike an xhr, we need a document do work on, so we can put the script in the
// body to ensure we have one to work with
var nwt = new NameWindowTransport(function(data) {
alert(data);
});
nwt.beginRequest("Window.Name.Server.aspx");
</script>
</body>
</html>
window.client.server.htm
<html>
<script type='text/javascript'>
window.name = document.getElementsByTagName('script')[0].innerHTML.match(/temp\s*=([\w\W]*)/)[1];
temp = { foo: 'bar' } //<-- this is the data
</script>
</html>
window.client.server.aspx
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Web.Script.Serialization" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
Response.Write("<html><scr" + @"ipt type='text/javascript'>window.name=document.getElementsByTagName('script')[0].innerHTML.match(/temp\s*=([\w\W]*)/)[1];temp=");
var data = new { foo = "bar" };
Response.Write(new JavaScriptSerializer().Serialize(data));
Response.Write("</scr" + "ipt></html>");
}
</script>