Monday, December 29, 2008

UniversalComet - Making every client addressable through URIs

Based on my earlier experiments, I have developed a JavaScript library that makes it extremely easy to incorporate "comet" or server-push technology into any web application without need for special programming or any special support on the server. Ressources needed on the server are also practically zero.

When you use the JavaScript library, you will receive an URI that identifies the client. Now you can make simple HTTP-GET requests to that URI with a message parameter and the client will receive the message immediately. Because only your application will know the un-guessable URI, the client should be save from unwanted messages. The use of HTTP-GET messages also allows sending messages in a "P2P"-fashion from client to client using JSONP cross-domain-messages.

To use the JavaScript library put this piece of code on your website:
<script type="text/javascript" src="http://universal-comet.appspot.com/static/client-server-mini.js"></script>
<script type="text/javascript">
var server = new Addressable.Server();

server.onmessage = function (message) {
alert(message)
}

server.connect(function (id, url) {
// send url to you server using AJAX
})
</script>
A fully working HTML-page can be copied from here.

The function that is passed to the connect-method receives the URI of the client and as soon as messages arrive they will be send to the onmessage-callback.

A Google App Engine application is used as a kind of reverse-proxy for the messages to the clients. Thus there will be no extra load on your server. The JavaScript application always maintains only one connection to the comet-proxy per domain. If a clients has Google Gears installed (Google Gears is not needed for operation) there will only be one connection per web browser. This minimizes the load on the comet-proxy.

The JavaScript application uses "channels" to differentiate between different windows that the same client has open at any given time. These are cached in window.name. If you set window.name yourself this value is used. You can also set server.setChannel("myChannel") before you connect to name the channel yourself.

You can try out the library in the iframe below. This is extremely alpha, practially untested code. If you have a problem, please post a comment (Rudimentary testing has been done in FF3 and Safari on the Mac, FF2 and IE7 on Windows. All with and without Gears.).


Update: There is now a chat sample app.
Post a Comment