这部分将实际开发一个应用,套用了一个老外的示例模板,做了一个在线礼品的简易版本。
先讲一下应用的结构
页面端:
demo.jsp用来展示界面
服务端:
DemoAction是Struts中的Action子类负责控制转换,
DemoFacade是业务类负责业务处理。
Goods是一个业务实体类
Struts部分的配置就忽略不说了,实际上这个应用并没有包含Struts的配置
主要讲一下dwr的配置,首先需要在web.xml增加下面的servelt映射:
xml 代码
- <servlet>
- <description>Direct Web Remoter Servlet</description>
- <servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
- </servlet>
- <servlet-mapping>
- <servlet-name>dwr-invoker</servlet-name>
- <url-pattern>/dwr/*</url-pattern>
- </servlet-mapping>
如上uk.ltd.getahead.dwr.DWRServlet是dwr的核心,用来处理javascript的对远程方法的调用,还有其他参数请参考相关文档。
然后,需要在dwr.xml配置相应的远程方法(与具体需要在客户端调用的方法相关),如下为演示应用的配置:
xml 代码
- <dwr>
- <allow>
- <convert converter="bean" match="dwr.demo.Goods"/>
- <create creator="new" javascript="DemoAction" class="dwr.demo.DemoAction">
- <include method="query4dwr"/>
- <include method="copy4dwr"/>
- <include method="paste4dwr"/>
- </create>
- <create creator="new" javascript="DemoFacade" class="dwr.demo.DemoFacade">
- <include method="queryList"/>
- <include method="restore"/>
- <include method="del"/>
- </create>
- </allow>
- </dwr>
如上有一个转换器(converter)是用来映射dwr.demo.Goods为bean类型,其他转换器类型请参考相关文档;还有两个创建器分别创建 javascript中的DemoAction类和DemoFacade类,分别对应dwr.demo.DemoAction类和 dwr.demo.DemoFacade,其中定义的方法就可以从javascript中直接调用了。
最后,我们需要在页面中包含相应的javascript:
<script src="http://www.zhmy.com/dwr/interface/DemoAction.js"></script>
<script src="http://www.zhmy.com/dwr/interface/DemoFacade.js"></script>
<script src="http://www.zhmy.com/dwr/engine.js"></script>
<script src="http://www.zhmy.com/dwr/util.js"></script>
如上,dwr/interface/DemoAction.js和dwr/interface/DemoFacade.js是dwr自动生成的 javascript文件,包含相应的类及方法,dwr/engine.js是dwr的核心引擎脚本处理客户端调用的转换,dwr/util.js包含了工具函数简化页面处理。
下面以查询为例,看一下dwr的具体使用:
DemoAction:
public List query4dwr(int type, boolean needClear, HttpServletRequest request) {
if (needClear) request.getSession().removeAttribute("dwr.demo.goodsId");
return demoFacade.queryList(type);
}
demo.jsp:
function updateResults() {
DWRUtil.removeAllRows("goodsbody");
var type = document.getElementById("type").value;
DemoAction.query4dwr(type, true, fillTable);
}
function fillTable(goods) {
document.forms[0].select.checked = false;
document.getElementById("totalRecords").innerHTML = goods.length;
DWRUtil.addRows("goodsbody", goods, [ addCheckbox, getName, getPrice, getCount]);
}
如上,DemoAction.query4dwr(type, true, fillTable)就可以直接调用DemoAction的方法了,这里fillTable是函数,dwr通过回调函数的方式来进行后续处理。比较一下 javascript和action中的方法参数,HttpServletRequest是可以不传的,dwr会自动加上,另一个就是回调参数放在最后,这是比较好的方式,其他方式请参考文档。
最后看一下,dwr如何与Struts集成,如下代码:
public ActionForward query(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception {
String type = request.getParameter("type");
//或者从form中取值
List goodsList = query4dwr(Integer.parseInt(type), true, request);
request.setAttribute("goodsList", goodsList);
return mapping.findForward("success");
}
public List query4dwr(int type, boolean needClear, HttpServletRequest request) {
if (needClear) request.getSession().removeAttribute("dwr.demo.goodsId");
return demoFacade.queryList(type);
}
前一个方法是Struts的方式,但dwr不支持,因此要重构一下在下面的方法才可以被dwr调用。
实际上,只有在方法中需要使用到HttpServletRequest是才需要重构方法,如果不使用HttpServletRequest,我们就可以直接调用业务层的类的方法,这样即简单又方便,如下:
demo.jsp:
function restore() {
DemoFacade.restore(updateResults);
}
DemoAction:
public synchronized void restore() {
goodsList.clear();
initGoods();
}
小结
dwr封装了ajax中与服务端交互的模块,通过直接调用服务端类的方法简化了客户端与服务端的交互。虽然说还缺省类似tag这样的组件,但已经很大程度简化了ajax的开发。
资源
1、示例源程序:下载
2、dwr主站:http://getahead.ltd.uk/dwr
3、ajax主站:http://en.wikipedia.org/wiki/AJAX
<!----><!---->
Trackback: http://tb.blog.csdn.net/TrackBack.aspx?PostId=600202
分享到:
相关推荐
**Ajax与DWR技术详解** ...总之,Ajax和DWR在现代Web开发中起着关键作用,它们提供了一种高效、灵活的方式,使得Web应用更加动态和响应迅速。学习和掌握这些技术,对于提升Web应用的用户体验至关重要。
在"Dwr与Struts开发实例"中,我们将探讨如何将这两者结合起来,以实现更高效、更富用户体验的Web应用。首先,我们需要了解DWR的基本概念。DWR的核心功能在于创建一个安全的、跨域的通信层,使得JavaScript可以透明地...
使用DWR时,首先要在服务器端创建一个DWR引擎实例,并配置允许客户端访问的Java对象和方法。接着,在客户端,通过引入DWR生成的JavaScript文件,就可以直接调用这些服务器端的方法。DWR简化了跨域问题,让开发者...
Ajax(Asynchronous JavaScript and XML)框架是Web开发中用于创建动态、无需刷新页面即可与服务器交互的应用程序的技术。DWR(Direct Web Remoting)是一种流行的Ajax框架,它简化了JavaScript和Java之间的通信,...
【标题】"Web开发实例(DWR+Struts2)"揭示了一个综合性的Web应用程序开发案例,其中结合了Direct Web Remoting (DWR) 和Struts2框架。DWR是一种JavaScript库,它允许在浏览器和服务器之间进行实时、异步的通信,从而...
采用dwr+Ajax和struts开发文件上传进度条(网络文章)
DWR (Direct Web Remoting) 是一种在...通过DWR,开发者可以轻松地构建具有Ajax功能的Web应用,提高用户体验,同时降低开发复杂性。在实际项目中,还可以结合Spring、Struts等框架进一步优化和扩展DWR的应用。
总结来说,SSH框架+Ajax(DWR)的组合提供了一种强大的开发模式,能够构建复杂且高性能的Web应用。这种模式将后端的业务逻辑、数据持久化和前端的用户交互紧密结合,极大地提升了开发效率和应用质量。在实际开发过程...
Struts2和DWR(Direct Web Remoting)的整合是Web开发中的一种常见技术组合,它们可以帮助开发者构建高效、交互性强的Web应用。Struts2作为MVC框架,提供了强大的控制层支持,而DWR则允许JavaScript在浏览器端直接...
在J2EE开发中,Struts2框架和AJAX技术的结合使用能够提供更优秀的用户体验,特别是在处理表单验证和实时交互方面。本实例主要讲解如何在Struts2中集成AJAX,实现注册用户的即时用户名可用性检查。这个功能对于防止...
Ajax,全称 Asynchronous JavaScript and XML,是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现异步更新。Ajax 不是单一的技术,而是一组技术的...
Struts2.0和DWR(Direct Web Remoting)是两个在Web开发中常见的开源框架。Struts2.0作为MVC(Model-View-Controller)框架,主要用于构建企业级的Java Web应用,而DWR则是一种使得JavaScript可以与服务器端Java对象...
"ssh+ajax+dwr_freemarker"是一个结合了SSH、Freemarker、Ajax和DWR的Web开发实例,特别适合初学者学习。通过这个项目,开发者可以了解到如何整合这些技术来构建一个包含注册和登录功能的Web应用,理解它们各自的...
Freemarker、Struts2和DWR是Java Web开发中常用的三个组件,它们分别负责不同的职责,协同工作可以构建出高效、动态的Web应用程序。在这个实例中,我们将深入理解这三个技术,并通过具体配置来了解它们如何协同工作...
【标题】"dwr2+struts2+spring2.5+hibernate3实例!"涉及的是四个关键的Java Web开发框架和技术的整合应用。这个实例教程是为那些希望学习如何将Direct Web Remoting 2 (DWR2)、Struts2、Spring 2.5和Hibernate 3...
这个实例是基于DWR(Direct Web Remoting)技术和Struts框架来实现的,旨在帮助开发者更好地理解如何在实际项目中处理这种交互。以下是关于这个实例的详细知识点: 1. **DWR**:DWR是一种JavaScript库,允许在...
在SSH(Spring、Struts、Hibernate)框架下,Ajax与DWR的整合可以提高Web应用的交互性和响应速度。以下是整合步骤: 1. **添加依赖**:在项目中引入DWR相关的jar包,并配置web.xml,包括DWR的Servlet配置。 2. **...
标题 "dwr2.0整合Struts1.3+hibernate3.1+spring2.5的项目" 涉及的是一个经典的Java Web开发技术集成,这其中包括Direct Web Remoting (DWR) 2.0、Struts 1.3、Hibernate 3.1和Spring 2.5。这个项目可能是为了展示...
综上所述,这篇实战指南详细介绍了如何利用Dwr2、Struts2、Spring2.5和Hibernate3构建一个用户登录注册系统,涵盖了前端Ajax验证、后端业务处理、数据库操作以及依赖库的管理,为初学者提供了宝贵的实践指导,同时也...