Welcome!

AJAX & REA Authors: Sebastian Kruk, Stephen Pierzchala, ExtraHop Networks, Kevin Benedict, RealWire News Distribution

Related Topics: AJAX & REA, Java, PowerBuilder, .NET, Web 2.0, Apache

AJAX & REA: Blog Feed Post

Building a Simple Peer-to-Peer WebSocket App – Part 2

A Step-by-Step Tutorial

By Jonas Jacobi
Article Rating:
August 13, 2012 06:00 AM EDT
Reads:
 4,159 

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Kaazing WebSocket Tutorial - JMS</title>
        <script src="http://demo.kaazing.com/lib/client/javascript/StompJms.js" type="text/javascript" language="javascript"></script>
    </head>
    <body onload="doConnect()">
        <div id="logMsgs"></div>
    </body>
</html>

 

Line 05: References the Kaazing WebSocket client libraries that ensure that communication between any Web browser and the WebSocket server is seamless, even if the browser doesn’t natively support the WebSocket API and protocol.
Line 07: Invokes the doConnect() function after the contents of the page is loaded.
Line 08: Defines a div tag that will contain the log messages. At the moment, we just have a completely empty HTML page, so there’s nothing exciting to see yet.

Let’s move on to the JavaScript code. While walking through the JavaScript code, we’ll see the power of messaging. One of the key differentiators that sets the Kaazing WebSocket Gateway apart from other WebSocket servers is its extensive support for rich business protocols and messaging APIs on top of the WebSocket standard, including XMPP, JMS, and AMQP. This tutorial focuses on the most widely used messaging API: Java Message Service (JMS).

JMS is a messaging standard that allows the loose coupling of applications by creating, sending, receiving, and reading messages. The Kaazing JMS offering extends the reach of enterprise messaging applications to the Web by providing JMS APIs in various client technologies, including Java, JavaScript, Microsoft .NET/Silverlight, as well as Flash/Flex. In this tutorial, we focus on the JavaScript JMS APIs and how you can use JMS in modern HTML5 applications.

The following code shows a simple example of a JavaScript application that uses Kaazing’s JMS APIs. Take a look at the code, then the explanations below the code snippet.

 

// Variables you can change
//
var MY_WEBSOCKET_URL = "ws://tutorial.kaazing.com/jms";
var TOPIC_NAME = "/topic/myTopic";
var IN_DEBUG_MODE = true;
var DEBUG_TO_SCREEN = true;

// WebSocket and JMS variables
//
var connection;
var session;
var wsUrl;

// JSFiddle-specific variables
//
var runningOnJSFiddle = (window.location.hostname === "fiddle.jshell.net");
var WEBSOCKET_URL = (runningOnJSFiddle ? MY_WEBSOCKET_URL : "ws://" + window.location.hostname + ":" + window.location.port + "/jms");

// Variable for log messages
//
var screenMsg = "";

// Used for development and debugging. All logging can be turned
// off by modifying this function.
//
var consoleLog = function(text) {
    if (IN_DEBUG_MODE) {
        if (runningOnJSFiddle || DEBUG_TO_SCREEN) {
            // Logging to the screen
            screenMsg = screenMsg + text + "
";
            $("#logMsgs").html(screenMsg);
        } else {
            // Logging to the browser console
            console.log(text);
        }
    }
};

var handleException = function (e) {
    consoleLog("EXCEPTION: " + e);
};

// Connecting...
//
var doConnect = function() {
    // Connect to JMS, create a session and start it.
    //
    var stompConnectionFactory = new StompConnectionFactory(WEBSOCKET_URL);
    try {
        var connectionFuture = stompConnectionFactory.createConnection(function() {
            if (!connectionFuture.exception) {
                try {
                    connection = connectionFuture.getValue();
                    connection.setExceptionListener(handleException);

                    consoleLog("Connected to " + WEBSOCKET_URL);
                    session = connection.createSession(false, Session.AUTO_ACKNOWLEDGE);
                    connection.start(function() {
                        // Put any callback logic here.
                        //
                        consoleLog("JMS session created");
                    });
                } catch (e) {
                    handleException(e);
                }
            } else {
                handleException(connectionFuture.exception);
            }
        });
    } catch (e) {
        handleException(e);
    }
};
​

 

At the top of this code snippet, you can see variables that you can change.

Line 03: MY_WEBSOCKET_URL points to the WebSocket server, which in our case runs on tutorial.kaazing.com. JMS, being a messaging API, follows the publish/subscribe pattern.

Line 04: A topic in JMS is a distribution mechanism for publishing messages that are delivered to multiple subscribers. Our topic is called /topic/myTopic. You can, and probably should change the name of the topic to your liking to ensure nobody else is interfering with your experimentation. For example:

 

var TOPIC_NAME = "/topic/PeterTopic";

 

Lines 05-06: The IN_DEBUG_MODE and DEBUG_TO_SCREEN variables give you simple ways to control debugging. By default, debugging is enabled and is directed to the screen.

Lines 16-17: If the app is running outside of the context of JSFiddle, the WebSocket URL is constructed dynamically, pointing back to the same server where the HTML page was downloaded from.

Line 21: The screenMsg variable holds the log messages.
Note: When this variable grows big, the performance of the application may degrade significantly. If you’re seeing increased latency, disabling logging of the application often helps.

Line 26: The consoleLog() function is used for logging. It honors the preferences set through the logging variables, specified in lines 05-06.

Line 45: The doConnect() function is in charge of establishing the WebSocket connection.

Line 48: Next, we create a StompConnectionFactory, allowing us to create a connection with a JMS provider via a WebSocket connection.

Line 50: Then, we create a connection, where ConnectionFuture handles the returned result.

Line 57: Finally, we create a session. Optionally, you can use sessions to handle transactions. This tutorial doesn’t use transactions.

When you run this code, the Result pane in the bottom right displays the following log messages:

 

Connected to ws://tutorial.kaazing.com/jms
JMS session created

 

In Part 3 (coming soon), we will evolve our application.


Read the original blog entry...

Published August 13, 2012 – Reads 4,159
Copyright © 2012 SYS-CON Media, Inc. — All Rights Reserved.
Syndicated stories and blog feeds, all rights reserved by the author.

More Stories By Jonas Jacobi

Jonas Jacobi is President and CEO of Kaazing, a privately held company that delivers next generation high-performance Web communication platform providing distribution of live data to the online financial trading, betting, gaming, auction, social, and media industries. Before co-founding Kaazing Jonas served as VP of Product Management for Brane Corporation, a leader in platform and technology independent solutions for any type of application software technology, automating the entire application development process required to maximize the business value of software. Prior to Brane Corporation, he spent over 8 years at Oracle where he served as a Java EE and open source Evangelist, and product manager responsible for the product management of JavaServer Faces, Oracle ADF Faces, and Oracle ADF Faces Rich Client in the Oracle Application Server division. Jonas is a frequent speaker at international conferences and has written numerous articles for leading IT magazines such as Java Developer's Journal, JavaPro, AjaxWorld, and Oracle Magazine. Mr. Jacobi is co-author of the best-selling book Pro JSF and Ajax: Building Rich Internet Components, (Apress).

Cloud Expo Breaking News
By Liz McMillan
SYS-CON Events announced today that OpenStack will exhibit at SYS-CON's 12th International Cloud Expo, which will take place on June 10–13, 2013, at the Javits Center in New York City, New York. OpenStack software controls large pools of compute, storage, and networking resources throughout a datacenter, all managed by a dashboard that gives administrators control while empowering their users to provision resources through a web interface. OpenStack powers some of the most widely-used SaaS app...
May. 23, 2013 02:00 PM EDT  Reads: 1,034
By Elizabeth White
SYS-CON Events announced today that Wowrack will exhibit at SYS-CON's 12th International Cloud Expo, which will take place on June 10–13, 2013, at the Javits Center in New York City, New York. Wowrack’s core expertise lies in high-availability Private and Public Cloud IaaS Hosting Solutions. Wowrack provides a true Hybrid service – where business release all IT management and hardware provisioning – taking the data center and server system administrative headaches off our customer’s shoulders. ...
May. 23, 2013 12:15 PM EDT  Reads: 1,048
By Liz McMillan
Many have heard of OAuth but are unsure of how it might apply to their business. In his session at the 12th International Cloud Expo, Alistair Farquharson, CTO of SOA Software, will describe how OAuth can be used to facilitate certain business models and simplify the sharing of private data. Alistair Farquharson is a visionary industry veteran focused on using disruptive technologies to drive business growth and improve efficiency and agility within organizations. As the CTO of SOA Software A...
May. 23, 2013 11:14 AM EDT  Reads: 511
By Elizabeth White
“Cloud has everything to do with what has happened with Big Data,” explained Jason Deck, Director of Strategic Alliances at Logicworks, in this exclusive Q&A with Cloud Expo Conference Chair Jeremy Geelan. “Big Data doesn’t exist in its easily accessible way without cloud. From reduced startup costs, to cheap storage, to fast processing, to adequate security, to the easy incorporation of third-party analytics tools, cloud made Big Data accessible to customers of all sizes, with all different bud...
May. 23, 2013 11:00 AM EDT  Reads: 1,140
By Pat Romanski
SYS-CON Events announced today that nfina Technologies, a provider of highly reliable cloud server products, will exhibit at SYS-CON's 12th International Cloud Expo, which will take place on June 10–13, 2013, at the Javits Center in New York City, New York. nfina Technologies develops, manufactures, and markets highly reliable cloud server products, designed to solve the most demanding data center requirements in mission-critical cloud applications. Nfina’s staff has decades of experience in co...
May. 23, 2013 11:00 AM EDT  Reads: 1,006
By Liz McMillan
“Social, mobile, analytics and cloud can’t be looked at as distinct technology trends; they are facets of the same movement and an everyday reality for consumers and businesses alike,” said Craig Sowell, IBM VP of SmartCloud Marketing, in this exclusive Q&A with Cloud Expo Conference Chair Jeremy Geelan. “This means that businesses need to start looking at trends as one: cloud is the delivery, analytics is the unique insight, social is a shareable service, and mobile is the ubiquitous access.” ...
May. 23, 2013 10:00 AM EDT  Reads: 1,014
By Pat Romanski
In his session at the 12th International Cloud Expo, Dave Eichorn, Global Data Center Practice Head at Zensar, will share a case study describing how a utility services company handled the migration of its Microsoft platform to the cloud. Challenged with the time-consuming task of opening operations out of temporary offices, this company struggled with the need to simultaneously access data that was accumulated from a vast amount of data-intensive jobs. Zensar migrated the company’s application ...
May. 23, 2013 10:00 AM EDT  Reads: 1,009
By Liz McMillan
Organizations across the world are increasingly starting to see the benefits of moving more and more services to the cloud. The focus on the cost-saving potential of cloud is rapidly shifting to completely transforming the business with cloud. As organizations are investing enormous sums on technology they are starting to realize that in order to maximize the return on investment and accelerate the business transformation process the first area of focus should be people. By ensuring the organiza...
May. 23, 2013 09:45 AM EDT  Reads: 890
By Elizabeth White
You're getting pitched every day from your legacy enterprise software and hardware vendors about "cloud." They're doing an amazing job of convincing your CIO and CTO about what cloud is and how you should use it. The reality is they're defending their shrinking market share and keeping you on the legacy treadmill for as long as they can by selling you solutions that aren't "cloud." In her session at the 12th International Cloud Expo, Niki Acosta, Cloud Evangelista for Rackspace, will talk thro...
May. 23, 2013 09:38 AM EDT  Reads: 442
By Elizabeth White
As enterprises deploy private IaaS clouds into production they are reevaluating their future application delivery models. SUSE and WSO2 believe that private PaaS will leverage the automation and scalability of Private IaaS solutions, such as OpenStack-based SUSE Cloud, to deliver the secure, standardized development environments that will make migrating to an agile, serviceoriented delivery model possible. In their session at the 12th International Cloud Expo, Chris Haddad, VP of Technology Ev...
May. 23, 2013 09:00 AM EDT  Reads: 1,317
MORE »