ajax/dwr/struts实例开发
2007-03-22 11:36
387 查看
ajax/dwr/struts实例开发 | |
发布者: 发布时间:2007-01-09 | |
2005是Ajax最火爆的年份,以gmail为先驱的Ajax应用已经逐渐深入人心了。也许这就是所谓的轮回吧,计算机界面的设计从最初瘦到胖再到瘦,如今又要开始胖了。不过,在web界面的胖与之前的胖还是有很多区别的,web界面的胖主要依赖于DHML和Javascript来实现。这也是本文的来由了,相信很多OO的开发人员都不愿与页面层的效果打交道,尤其是Javascript的这样的开发语言,我也是其中之一了,非常不喜欢Javascript,语法松散,结构复杂。反正是不喜欢了,但是在web时代,既然流行胖子,想不用Javascript是不可能的了,那么怎么样来简化Ajax的开发呢?DWR由此延生了,他封装了XMLHttpRequest,直接调用服务端的方法,省了好多Javascript啊^_^ Struts虽然已经开始开下陡路,但底子厚,将DWR与Struts结合依然会是大多数开发者的选择。 本文分两部分:框架介绍和实例开发。先来: 第一部分 框架介绍 一、Ajax介绍 Ajax--Asynchronous JavaScript and XML,异步JavaScript和XML。 名字中已经包含Ajax的组成部分:异步处理XMLHttpRequest,JavaScript,XML。 其中: 1、XMLHttpRequest是Ajax的关键部分,正是由于他的存在,才使得胖子越来越吃香了。 2、JavaScript是Ajax的必备部分,没有他还玩个屁 3、XML是Ajax数据格式的推荐方式,但也可以不用 当然还少不了CSS,有了CSS使得在Ajax中更容易修改用户的界面 Ajax的细节和样例使用就不多说了,N多的资源,自己找吧。 二、DWR介绍 DWR-Direct Web Remote,翻译过来应该是直接远程网页访问。(这个Web一直找不到好的词语来表达,这里就用网页吧) 如名字所述,DWR的主要特点就是可以在Ajax中直接调用服务器上的方法,很奇妙吧。就是说,不需要通过URL来告诉服务来处理,而是直接在Javascript中调用类的方法,并返回数据。 DWR简化了Ajax的开发: 1、封装了Ajax中的使用,不再需要直接使用XMLHttpRequest了,这可是非常重要的,减少了好多Javascript呀 2、通过回调函数的方式,简化了错误处理及返回数据的处理。 3、直接调用服务器类的方法,不再需要通过URL方式,也省了不少的事。 DWR的主要部件有:dwr.xml/engine.js/util.js,前者是DWR的Servlet使用的配置文件,后两者DWR替我们封装的Ajax的代码,当然也提供了其他有用的功能。 三、Struts介绍 Struts还用介绍吗?没听说过?那就不用往下看,休息休息吧^_^ 这里就说一下在DWR如何调用Struts中Action的方法吧,说白了,是不可能的。这不是白说吗#$@$@%@# 实际上是这样的,虽然DWR支持方法的调用,但ActionForward/ActionForm/ActionMap这些东西如何在DWR调用方法前生成呢?我也不知道,所以DWR对Struts的支持实际上就是要重构Action中的方法,去掉上面的东西,然后就可以了(这是DWR说的,可不是我说的^_^)。 看了上面的一小通介绍,不知道大家有没有什么感觉,我也觉得写得太少了,可能看了跟没看差不多。不过这里主要是想大家对这些概念有个了解。接下来的第二部分,将会以实例开发的方式来写,这样就更容易依样画葫芦了(我也比较喜欢这样的方式)。 摘要:先讲一下应用的结构页面端: demo.jsp用来展示界面服务端: DemoAction是Struts中的Action子类负责控制转换, DemoFacade是业务类负责业务处理。 Goods是一个业务实体类Struts部分的配置就 先讲一下应用的结构 页面端: demo.jsp用来展示界面 服务端: DemoAction是Struts中的Action子类负责控制转换, DemoFacade是业务类负责业务处理。 Goods是一个业务实体类 Struts部分的配置就忽略不说了,实际上这个应用并没有包含Struts的配置 主要讲一下dwr的配置,首先需要在web.xml增加下面的servelt映射: <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配置相应的远程方法(与具体需要在客户端调用的方法相关),如下为演示应用的配置: <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='dwr/interface/DemoAction.js'></script> <script src='dwr/interface/DemoFacade.js'></script> <script src='dwr/engine.js'></script> <script src='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 |
相关文章推荐
- ajax/dwr/struts实例开发(转)
- ajax/dwr/struts实例开发
- ajax/dwr/struts实例开发
- ajax/dwr/struts实例开发(下)
- [精]采用dwr+ajax和struts开发文件上传进度条
- [转]采用dwr+ajax和struts开发文件上传进度条
- Ajax_jquery_struts_json组合开发实例
- [精]采用dwr+ajax和struts开发文件上传进度条
- 采用dwr+ajax和struts开发文件上传进度条(转)
- 使用ASP.Net 3.5 的Ajax与Web服务开发实例
- 使用手动配置的方式开发第一个Struts项目的步骤以及实例
- struts开发实践—读写xml实例
- 用Eclipse+MyEclipse开发struts的一个经典的实例(转)
- 用Eclipse+MyEclipse开发struts的一个经典的实例(转)
- DWR高级主题之反向Ajax(轮询模式实例--DWR2.X)
- struts2+ajax的简单实例
- struts开发实践—读写xml实例
- 详细介绍用JBuilder9开发的Struts实例
- J2EE框架(TomcatStrutsHibernateSpringAjax(dojo))开发步骤:
- Spring与struts整合开发实例(一)