HTML5 Zone is brought to you in partnership with:

Raymond Camden is a developer evangelist for Adobe. His work focuses on web standards, mobile development and Cold Fusion. He's a published author and presents at conferences and user groups on a variety of topics. He is the happily married proud father of three kids and is somewhat of a Star Wars nut. Raymond can be reached via his blog at www.raymondcamden.com or via email at raymondcamden@gmail.com Raymond is a DZone MVB and is not an employee of DZone and has posted 254 posts at DZone. You can read more from them at their website. View Full User Profile

ColdFusion 10 Web Socket JavaScript APIs

02.26.2012
| 3863 views |
  • submit to reddit

In my last post, I demonstrated three examples of websockets under ColdFusion 10. One thing I didn't really touch on was the JavaScript API you can use to work with websockets. These functions are available to any file making use of the cfwebsocket tag. They allow you to:

  • Open or close a connection as well as checking if the connection is open (openConnection, closeConnection, isConnectionOpen)
  • Subscribe or unsubscribe to a channel (remember that the cfwebsocket tag can autosubscribe you - that's what my demos did)
  • Authenticate you - technically your back end code will do this, but this helps set up your websocket connection as an authenticated one
  • Get a list of what you're subscribed too (getSubscriptions)
  • Get a count of the people subscribed to a channel (getSubscriptionCount)
  • And finally, invokeAndPublish, which lets you use the websocket connection to run a CFC method.

Each of these functions are asynchronous. The docs clearly say this and anyone who doesn't see this may be a bit slow. (-sigh- yes... I missed it.) So as a simple example, I wanted to add a subscriber count to my chat application. I added the following code within my user registration system (the code run when you tell the application your name):

window.setInterval(function(){
    chatWS.getSubscriberCount("chat")
},2000);

Remember that "chatWS" is a JavaScript object that is my 'hook' to the websocket.

Each of the JavaScript methods will use your message handler for results. This means your message handler has to be a bit complex. Previously it handled new user arrivals as well as messages. So now I have to add a bit more logic to handle this result. Here's my message hander:

function msgHandler(message){
    //Only care about messages
    if (message.type == "data") {
        var data = JSON.parse(message.data);
        if(data.type == "chat") $("#chatlog").append(data.username + " says: " + data.chat + "\n");
        else $("#chatlog").append(data.chat + "\r");
        $('#chatlog').scrollTop($('#chatlog')[0].scrollHeight);
        console.log("Append "+data.chat);
    }
        
    if(message.type == "response" && message.reqType == "getSubscriberCount") {
        $("#userCount").text(message.subscriberCount);
    }
}

You can visit the demo here: http://raymondcamden.com/demos/2012/feb/19/chat/#

p.s. When I first tried to use this feature, I didn't realize the calls were asynchronous, even though the docs say this. I also didn't realize my message handler would get the result. I thought - why not simply get a user count after we get each message. So I put the call in the message handler. Take a while guess what this did to my server.


Source: http://www.raymondcamden.com/index.cfm/2012/2/23/ColdFusion-10-Web-Socket-JavaScript-APIs

Published at DZone with permission of Raymond Camden, author and DZone MVB.

(Note: Opinions expressed in this article and its replies are the opinions of their respective authors and not those of DZone, Inc.)