Monday, February 13th, 2006

Event Driven IO JavaScript Hack in the new GTalk (in GMail)

Category: Examples, Google, JavaScript

One of the beauties of JavaScript is that you can crack open a .js file that is served up, and start to take it apart. Obfuscation? Phfff :)

Alex Russell has done just that and asks: What else is burried down in the depth’s of Google’s amazing JavaScript?.

Alex knows about the perils of pushing data with HTTP, since he works for Jot, who create Jot Live.

He found a hack in the Gmail Talk code that he likes:

But couldn’t you do something with XMLHTTP? Short answer: yes, but not as portably and it won’t get you around IE’s 2-connection limit either, so there’s not much of a win. For the long answer, see my talk at ETech or wait for me to post the slides. At the end of the day, the hidden <iframe> hack scales best and is the most portable. Especially if you can lick the UX problems.

Which Google has.

How? By cleverly abusing another safe-for-scripting ActiveX control in IE. Here’s the basic structure of the hack:

javascript

  1. // we were served from child.example.com but have already set document.domain
  2. var currentDomain = "http://exmaple.com/";
  3. var dataStreamUrl = currentDomain+"path/to/server.cgi";
  4. var transferDoc = new ActiveXObject("htmlfile"); // !?!
  5. // make sure it's really scriptable
  6. transferDoc.open();
  7. transferDoc.write("<html>");
  8. transferDoc.write("<script>document.domain='"+currentDomain+"';</script>");
  9. transferDoc.write("</html>");
  10. transferDoc.close();
  11. // set the iframe up to call the server for data
  12. var ifrDiv = transferDoc.createElement("div");
  13. transferDoc.appendChild(ifrDiv);
  14. // start communicating
  15. ifrDiv.innerHTML = "<iframe src='"+dataStreamUrl+"'></iframe>";

This is the kind of fundamental technique that is critical to making the next generation of interactive experiences a reality. Server tools like mod_pubsub and LivePage (and even, perhaps, a JMS bus) are starting to come online and the benefits of event-driven IO are starting to pervade the server-side communities. It’s only a matter of time before server-push data hits an inflection point in the same way that background single-request/single-response data transfer did with Ajax. Dojo, will, of course have infrastructure to support this kind of thing when the borader developer community is ready (most if it is already in place).

GMail Talk

Posted by Dion Almaer at 2:00 am
2 Comments

++++-
4 rating from 36 votes

2 Comments »

Comments feed TrackBack URI

No, Abe’s clever technique relies on many of the same building blocks, and this technique can be combined with it, but they are distinct and solve different problems.

Comment by Alex Russell — February 13, 2006

Hi you all,
i tried the code on ie5.5 on win98 and end up with:

function rpc_iframe()
{
var currentDomain = “localhost/”;
var dataStreamUrl = currentDomain+”rpc-test/server.php”;
var transferDoc = new ActiveXObject(“htmlfile”); // neue Seite
transferDoc.open();
transferDoc.write(“”);
transferDoc.write(“document.domain='”+currentDomain+”‘;”);
transferDoc.write(“”);
transferDoc.close();
var ifrDiv = transferDoc.createElement(“div”);
transferDoc.appendChild(ifrDiv);
ifrDiv.innerHTML = “”;
}
Everything went fine… except the window wont close.
Any ideas to manage it?

Thanks in advance
M.

Comment by michael — August 24, 2006

Leave a comment

You must be logged in to post a comment.