DWR

March 11, 2013

DWR

DWR Integration Step By Step

Brief introduction of DWR
The DWR (Direct Web Remoting) project is an open source solution under the Apache license for the developer who wants to use AJAX and XMLHttpRequest in an easy way. It has a set of JavaScript functions that remove the complexity from calling methods in a Java object running on the application server from the HTML page. It handles parameters of different types and helps keep the HTML code readable.

DWR is not intrusive to one's design, as it does not force any sort of inheritance architecture for objects to be exposed. It fits well in any application that runs in a servlet framework. For the less DHTML-experienced developers, DWR also provides a JavaScript library to help with frequently used DHTML tasks, like populating tables, filling select boxes with items, and changing the content of HTML elements such as and.

The DWR Website is comprehensive and has a fair amount of documentation, which has served as a foundation for this article. Some examples are provided to demonstrate how DWR can be used and what can be accomplished with the library.
Reference: Java World

I am going to show you about how to integrate DWR framework in your running J2EE application. Below are the steps to configure DWR framework.

Step 1: Download required files
For integrating DWR in your application, you need some supported files. You can easily find these files on official page of DWR.
http://directwebremoting.org/dwr/index.html

You need to download below files,
1) dwr.jar [http://directwebremoting.org/dwr/downloads/index.html] [deploy in your respective WEB-INF/lib dir]
2) commons-logging.jar [deploy in your respective WEB-INF/lib dir]
3) util.js [deploy in your respective folder where your jsp and js files resides]
4) engine.js [deploy in your respective folder where your jsp and js files resides]

Step 2: Configuration in your web application
We need to create dwr.xml file where your DWR related configuration and put this file in dir where your web.xml of your application reside.
I am showing the structure of the dwr.xml.
// DWR XML Content

<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 3.0//EN" "http://getahead.org/dwr/dwr30.dtd">
<dwr>


<allow>
<filter class="com.makhir.filters.DWRFilter" />
<create creator="new" javascript="DWRInvoker">
<param name="class" value="com.makhir.servlets.DWRInvoker"/>
</create>
<convert converter="bean" match="com.makhir.vo.UserRegisterVO" /> 
</allow>

</dwr>

Now make an entry for dwr servlet in web.xml for URL mapping as below,
// web.xml entry
<servlet>
<servlet-name>dwr-starter</servlet-name>
<servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
<init-param>
    <param-name>debug</param-name>
    <param-value>true</param-value>
    </init-param>
</servlet>
<servlet-mapping>
<servlet-name>dwr-starter</servlet-name>
<url-pattern>/dwr/*</url-pattern>
</servlet-mapping>
Thats it as point of configuration.

Step 3: Code changes for Server side management
A) Create one filter with name DWRFilter whose entry is already available in dwr.xml with name DWRFilter
Note: We need not make this filter entry in our web.xml as we do traditionally
Below is the code snippet of for the filter,

  //DWRFilter.java
import java.lang.reflect.Method;
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import org.directwebremoting.AjaxFilter;
import org.directwebremoting.AjaxFilterChain;

public class DWRFilter implements AjaxFilter{
   private static Log logger = LogFactory.getLog(DWRFilter.class);
   @Override
   public Object doFilter(Object object, Method method, Object[] params, AjaxFilterChain filterChain) throws Exception {
    logger.debug("Enter : Entering into DWRFilter");
    // TODO: Add code for some filteration on methods and params which are interchange between server and client
    logger.debug("Exit : Entering into DWRFilter");
    return filterChain.doFilter(object, method, params);
   }
}

B) Create class for which is going to responsible for handling your reqeust of dwr call from the client
Here i made a class with name DWRInvoker.java as its entry already available in dwr.xml
Below is the code snippet of for the filter,

  //DWRInvoker.java
import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;
import com.makhir.vo.UserRegisterVO;

  public class DWRInvoker {
   private static Log logger = LogFactory.getLog(DWRInvoker.class);
   public DWRInvoker(){} // Default Constructor
   public Object getUserInfo(String userId){
    logger.debug("Enter : getUserInfo()");
    UserRegisterVO registerVO = new UserRegisterVO(); //UserRegisterVO which is going to transfer on network.Its entry available in dwr.xml
   registerVO.setUserName("Ashish Mishra");
    registerVO.setUserId(userId);
    registerVO.setDepartment("Development");
    logger.debug("Exit : getUserInfo()");
    return registerVO;
   }
}

C) Create POJO class which is also your value object. Here i have created with name UserRegistrationVO.java.
Make an entry in dwr.xml in convert element.

Step 4: Code changes for client side management
Now its time make some changes on client side.
Here we need to create jsp files in which you want to manage your interaction with client and server with help of DWR call.
A) Download engine.js file from official DWR home page and depoly it in your dir where your jsp resides
B) Download util.js file from official DWR home page and depoly it in your dir where your jsp resides
C) Creating DWRInvoker.js in your application where your jsp and scripting files resides

Below is script snippet for your reference,
   //DWRInvoker.js

if (typeof dwr == 'undefined' || dwr.engine == undefined) throw new Error('You must include DWR engine before including this file');
(function() {
  if (dwr.engine._getObject("DWRInvoker") == undefined) {
   var p;

   p = {};
   p._path = '/extreme/dwr';

   /**
   * @param {class java.awt.image.BufferedImage} p0 a param
   * @param {class java.lang.String} p1 a param
   * @param {class java.lang.String} p2 a param
   * @param {function|Object} callback callback function or options object
   */
   p.getUserInfo = function(p0, callback) {
     return dwr.engine._execute(p._path, 'DWRInvoker', 'getUserInfo', arguments);
   };

   dwr.engine._setObject("DWRInvoker", p);
  }
})();
/**
function DWRInvoker(){}
DWRInvoker.getUserInfo = function(p0,callback){
   DWREngine._execute('/extreme/dwr','DWRInvoker','getUserInfo',p0,callback);
}
*/
D) Create your JSP page from where actual DWR calling will happen
   Here, i my case i have created the jsp file for your reference with name profilePage.jsp which load the profile details.
   DWR call will made by the client when profilePage.jsp is load and fetch specific user profile data from server and display it onto client
   browser without refreshing the page.
   You can make DWR call through any of events supported by the HTML component.
   Below is code snippet of the jsp file.

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Extreme Application</title>
<script type="text/javascript" src="engine.js"> </script> <%-- engine.js which should always be first script file to be included [Mandatory] --%>
<script type="text/javascript" src="DWRInvoker.js"> </script> <%-- DWRInvoker.js needs to be included [Mandatory]--%>
<script type="text/javascript" src="util.js"> </script>   <%-- util.js needs to be included for enhance the feature provided by DWR[Optional] --%>
<script type="text/javascript">
function loadProfile(){
   dwr.util.useLoadingImage('images/ajax-loader.gif');   <%-- Progress image for showing the progress of dwr call on client side --%>
   DWRInvoker.getUserInfo(<%=userid%>, getinfo);    <%-- Actual DWR call to get user's profile data from the server --%>
}
function getinfo(data){           <%-- scripting method which handles the server response from DWR call--%>
   document.getElementById("txtUserName").value = data.userName;
   document.getElementById("txtDept").value = data.department;
   document.getElementById("txtCity").value = data.city;
}
</script>
</head>
<body onload="loadProfile();">
   <form action="#" method="post" name="updateFrom" id="updateFrom" enctype="multipart/form-data">
    <table align="left" id="regisTable" style="border-color: gray;">
     <tr>
      <td class="td">Name</td>
      <td class="td">:</td>
      <td class="td"><input type="text" name="txtUserName" id="txtUserName" value="''"/></td>
     </tr>
     <tr>
      <td class="td">Department</td>
      <td class="td">:</td>
      <td class="td"><input type="text" name="txtDept" id="txtDept" value="''"/></td>
     </tr>
     <tr>
      <td class="td">City</td>
      <td class="td">:</td>
      <td class="td"><input type="text" name="txtCity" id="txtCity" value="''" /></td>
     </tr>
    </table>
  </form>
</body>
</html>

This e-mail and any attached files are confidential, proprietary, and may also be legally privileged information, and are intended solely for the use of the individual or entity to whom they are addressed. If you are not the intended recipient of this e-mail, please send it back to the person who sent it to you and delete the e-mail and any attached files and destroy any copies of it; you may call us immediately at + 91 22 6643 8000 or email us at IT-Security@tatainteractive.com

Tata Interactive Systems and/or any of its sister companies owns no responsibility for the views presented in the e-mail and any attached files unless the sender mentions so, with due authority of Tata Interactive Systems.

Unauthorized reading, reproduction, publication, use, dissemination, forwarding, printing or copying of this e-mail and its attachments is prohibited.

We have checked this message for any known viruses; however we decline any liability, in case of any damage caused by a non-detected virus.

For more details about our company, visit http://www.tatainteractive.com.

Search This Blog

JavaExample

DWR

DWR Integration Step By Step

Comments

Post a Comment

Popular Posts

Tomcat - More Memory - CATALINA_OPTS