Real-time Updates on WebPages - Part 2 - Hello World Comet Application

Overview

*10/21/2008 Update* I mention in this post that I had an issue with Dojo 1.2.0, well I figured it out, read Part 3 for details.

Last week I wrote about the introduction of a HTTP Publish-Subscribe Server in WebLogic Server 10gR3.  The new feature is based on the concept of Comet and implements the Bayeux protocol and is very useful for publishing events immediately to subscribed clients over HTTP.  There are many uses for a feature like this, essentially any time where stale information should be updated on a web page as soon as possible.  This entry will showcase a basic Hello World example application that will demonstrate the basic mechanics for using this feature.  Click the image to enlarge and get a better look at the application.

helloJames

Pre-reqs

Dev Tools - I built this example with Oracle Enterprise Pack for Eclipse 1.0.0, the Eclipse 3.4 version, which you can download here.  If you just want to deploy the WAR file, then you can skip this.

Application Server - You will need WebLogic Server 10gR3.

Browser Debugging  - You must have Firebug for Firefox if you spend any time doing web development.  I insist.

Javascript Framework - It's also probably not a good idea for me to include Dojo Toolkit source with my example without getting approval, so grab a copy of that too.  I used version 1.1.1 because 1.2.0 was not out last week and more importantly when I tried 1.2.0 tonight, I got the error message below which leads me to believe there is a compatibility issue with 1.2.0 and the Bayeux implementation on WLS.  More to come when I figure this out.  I see that Dojo 1.2.0 version supports an additional connection type that WLS's pubsub server doesn't accept currently.  The bottom line is use Dojo 1.1.1 for now.

*10/21/2008 Update* I mention in this post that I had an issue with Dojo 1.2.0, well I figured it out, read Part 3 for details.

[{"channel": "/meta/handshake", "successful": false, "error": "402:long-polling-json-encoded:Invalid

supportedConnectionTypes attribute.", "supportedConnectionTypes": ["long-polling","callback-polling"

], "version": "1.0", "minimumVersion": "0.1", "advice": {"reconnect": "none", "interval": 500, "multiple-clients"

: false}}]


Server-side

The example consists of server-side components that simply requires editing two deployment descriptor files in your web application's WEB-INF folder.  The typical steps section of the documentation are pretty clear.  In your weblogic.xml file, add a reference to the pubsub library, which will cause WLS to merge the files in the pubsub library with your application at runtime.  Here is the simplest that file could look:


<?xml version="1.0" encoding="UTF-8"?>
<weblogic-web-app xmlns="http://www.bea.com/ns/weblogic/90"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<library-ref>
<library-name>pubsub</library-name>
<specification-version>1.0</specification-version>
</library-ref>
</weblogic-web-app>

Secondly, you will need a weblogic-pubsub.xml file.  Below is the simple one for my sample application.  Notice the channel pattern definition, which is concept very similar to a Topic in JMS, except that there is also pattern matching.  There are also some configuration constraints for the channel pattern.


<?xml version="1.0" encoding="UTF-8"?>
<wlps:weblogic-pubsub
xmlns:wlps="http://www.bea.com/ns/weblogic/weblogic-pubsub">

<wlps:channel>
<wlps:channel-pattern>/hello/**</wlps:channel-pattern>
<!--since no handler defined, the default handler will be used -->
</wlps:channel>

<wlps:channel-constraint>
<wlps:channel-resource-collection>
<wlps:channel-resource-name>subscribe</wlps:channel-resource-name>
<wlps:description>subscribe channel constraint</wlps:description>
<wlps:channel-pattern>/hello/*</wlps:channel-pattern>
<wlps:channel-operation>subscribe</wlps:channel-operation>
<wlps:channel-operation>create</wlps:channel-operation>
<wlps:channel-operation>publish</wlps:channel-operation>
</wlps:channel-resource-collection>
<!-- Open this up for all users, if this section is enabled, web users will need to authenticate
<wlps:auth-constraint>
<!- allow only user with "subscriber" role to subscribe to above channels ->
<wlps:role-name>subscriber</wlps:role-name>
</wlps:auth-constraint>
-->
</wlps:channel-constraint>

Client-side

The simple.jsp that is included with my project showcases the most basic example of Dojo client API.  For additional functionality, look at the source of index.jsp.  Both of these files just as easily could be html files instead of jsp.


<html>
<head>
<!-- Import Dojo -->
<script type="text/javascript" src=""dojo-release-1.1.1/dojo/dojo.js"
djConfig="parseOnLoad:true, isDebug:true"></script>

<script type="text/javascript">
dojo.require("dojox.cometd");
dojox.cometd.init("cometd");
dojox.cometd.subscribe('/hello/world', function(msg) { alert(msg.data.test); } );

</script>
</head>
<body>
<input type="button"
onclick="dojox.cometd.publish('/hello/world', { test: 'hello world' } )"
value="Click Me!">
</body>
</html>


Run it

Below are the steps for OEPE/Eclipse, if you just would rather work with the war file, download CometWEB.war, add Dojo 1.1.1 as described in step 3, and deploy to the server.


  1. Download my CometWEB project archive
  2. Import the archive into OEPE as an existing project.
  3. Put Dojo 1.1.1 in the web application so that the path to dojo looks like CometWEB\WebContent\dojo-release-1.1.1\dojo\dojo.js
  4. Deploy to WLS 10.3, I used the samples domain <WEBLOGIC_INSTALLATION>\wlserver_10.3\samples\domains\wl_server
  5. Go to your URL, on my configuraiton it is: http://localhost:7001/CometWEB/index.jsp

Try it in multiple browsers at the same time and publish messages to one another.  Use Firebug to see what is going on in the network traffic between the server and the client.  In future posts I plan on showing some of the protocol and discussing more advanced enterprise features like JMS integration and security.

Comments:

Hi Thank you, excellent articles. I want to change the connection-type from long-polling to callback-polling. How can I do it? I appreciate

Posted by sunny on June 18, 2010 at 02:57 AM PDT #

I haven't tried callback-polling, but presumably you could try the technique in Part 3 http://blogs.oracle.com/jamesbayer/2008/10/realtime_updates_on_webpages_p_1.html So in that one I removed supported type with code like this in web page: dojox.cometd.connectionTypes.unregister("long-polling-json-encoded"); So you might also try adding a line that removes long-polling like this: dojox.cometd.connectionTypes.unregister("long-polling-json-encoded"); dojox.cometd.connectionTypes.unregister("long-polling"); Simply a guess. Good luck, Thanks, James

Posted by james.bayer on June 18, 2010 at 05:53 AM PDT #

Hi, Your blog is really informative and i really appreciate your effort.I have a query here , can i have a simple html/javascript client without using a dojo toolkit feature.A reply will be iof great help to me.

Posted by Shyam on April 18, 2011 at 12:10 AM PDT #

Shyam, You'll need a client that understand the Bayeux protocol to work with the WebLogic Server HTTP PubSub engine. The Cometd project at http://cometd.org/ has some javascript examples that include JQuery I understand, but I do not have a working sample of it yet. it's on my to-do list. You could look into that if you want to investigate. Thanks, James

Posted by james.bayer on April 18, 2011 at 01:35 AM PDT #

Post a Comment:
Comments are closed for this entry.
About

James Bayer Image
I was formerly a Product Manager on the WebLogic Server team based out of Oracle HQ. You can find my new blog at http://iamjambay.com.
Follow Me on Twitter
Oracle WebLogic

Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today