Wednesday, May 16, 2007

Simple Direct Web Remoting Application In NetBeans

I'd never really heard of Direct Web Remoting (DWR) until a contract interview yesterday. Basically, it is an open-source AJAX idea that works by creating server-side listener interfaces directly from Java classes, and allowing client-side JavaScript to call the interface methods asynchronously. It's a Web 2.0 technology that makes AJAX development a little easier. Implementing DWR is still quite a manual process though, as this example demonstrates.

Setup: NetBeans 6.0 Preview (M9, build 070502) with Sun Java System Application Server 9.1 (build b41d-beta2). JDK is 1.6.0-rc-b104. My whole setup is beta builds, but it works.

Objective: The web application we'll develop simply allows a client (web browser) to query the web server for its version and JDK information. The underlying mechanism will be DWR-based.

(1) Download the DWR library from the Getahead download site. Version used in this exercise is 2.0.1, so the jar file will be archived locally as dwr-2.0.1.jar.

(2) Create the web application: File | New Project -> Web | Web Application [Finish]. Name this application DWRFirst and let its web context remain /DWRFirst.

(3) Import the DWR library into the web application: right-click the web application, select Properties -> Libraries | Add Jar/Folder and browse to the DWR archive in #1 above. Ensure that package is checked for the JAR on the compile tab before clicking [OK] to exit.

(4) Create a JavaBean that will be the basis of generated JavaScript. The usual rules of creating JavaBeans/POJOs apply. The bean uses classes from the DWR library (see source - section#1). Ours will be Info.java in package beans (beans.Info).

(5) Update the web deployment descriptor to reference the DWR servlet. Initialization parameters are optional, but when specified, you can access this servlet normally to review the interfaces generated by DWR and get the correct JavaScript file sources, in addition to testing the methods that'll be available to the client.
- To add the servlet, double-click web.xml and click [Servlets] then [Add Servlet Element]. Name = dwr-servlet, class = org.directwebremoting.servlet.DwrServlet, url pattern = /dwr/*.
- You should set the servlet to run at startup, and can add the optional debug initialization parameters by clicking the Add button in the the Initialization Parameters section of the servlet declaration on this page. (source - section #2)

(6) Create a DWR configuration file (dwr.xml) in the web application's WEB-INF directory - same place as web.xml. This file advertises what classes DWR can create for remoting, and their JavaScript names.
- Right-click the web app, select New | Other ... -> XML | XML Document [Next].
- Provide name = dwr.xml, folder = web\WEB-INF, and click [Next].
- Select DTD Constrained document type and click [Next]. Public ID = -//GetAhead Limited//DTD Direct Web Remoting 1.0//EN, System ID = http://www.getahead.ltd.uk/dwr/dwr10.dtd, and root = dwr. [Finish].
- Within the config file, you need to allow visibility of the remote interface by specifying allow|create nodes (see source - section #3). The name visible to client-side JavaScript is specified by the 'javascript' attribute of the create element.

(7) Use the JavaScript in a JSP or HTML page. This is the usual order of business where you reference scripts and write JS methods and such. You should always import all 3 scripts (one with name specified in #6 above, the engine.js, and util.js). See source - section #4.

(8) Deploy the web application and access it at http://[server:port]/DWRFirst/. The deployment descriptor specifies that index.jsp should be called. When you click the [Get Server/JDK Info] button on the page displayed, DWR does it's AJAX magic and information is returned as shown below.


[Source Code]