【DWR】Helloworld

网络上的DWR(Direct Web Remoting)的Helloworld五花八门,阅读了其中的几篇Helloworld,只觉得其作者写得太烦太杂,里面杂糅着许多技术,struts2有之,jquery有之,这些高大上的东西不是DWR必须的,DWR仅仅是需要本来就存在的javascript罢了。

关键是DWR的核心没有体现出来,DWR作用是一个页面在刷新的情况下不停地接收服务器发来的数据,部分DWR的Helloworld把发送数据与接收数据都写在一个页面了,让人无法清晰地了解里面接收数据与发送数据的过程。

其实DWR根本就无需这些东西,仅仅需要一个简单的dwr.jar就足够了,低版本的Tomcat还需要commons-logging-1.1.1.jar,这个包很常见到网上一搜索就有了。dwr.jar可以到官网下载(点击打开链接),笔者也上传了一份里面包含了以上包与web.xml的压缩包(点击打开链接),可以自行下载。

一、基本目标

在Tomcat服务器上编写两个页面,一个dwrsend.html与dwrec.html,dwrec.html接收dwrsend.html发过来的信息,在这期间dwrec.html无需手动刷新,如下图:

上图中,dwrrec窗口一直是处于非激活状态的,笔者根本不可能点过去按F5……

同时请注意,这是纯正的html页面,与jsp技术也没有半毛子的关系,但是dwr由于在其web.xml配置了servlet的东西,所以也必须扔到服务器中处理,但在开发过程中,开发者无需理会。

二、制作过程

1、基本配置

在Eclipse/Myeclipse中新建一个web工程,命名随意,切记下面的J2EE选择5.0或以上,笔者低版本的Myeclipse6.5默认是J2EE 1.4的,J2EE版本太低用不了DWR。

在创建出来的web工程webroot\web-inf\lib放入刚才下载好的commons-logging-1.1.1.jar与dwr.jar,

之后写好webroot\web-inf的web.xml,把下面的代码复制到你的web.xml,如果你的web.xml原本有其他东西则添加如下的<servlet>与<servlet-mapping>节点,当然请注意web-app version的内容,如果没有其他东西则直接覆盖吧,不要问我为什么,如果不这样写,DWR根本运行不了,甚至你的WEB工程都运行不了,web.xml是WEB工程最棘手的东西,弄不好很麻烦的。

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
	xmlns="http://java.sun.com/xml/ns/javaee"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
	http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
  <welcome-file-list>
    <welcome-file>index.jsp</welcome-file>
  </welcome-file-list>

  <servlet>
        <servlet-name>dwr-invoker</servlet-name>
        <servlet-class>org.directwebremoting.servlet.DwrServlet</servlet-class>
        <init-param>
            <param-name>debug</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>pollAndCometEnabled</param-name>
            <param-value>true</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>  

</web-app>

然后再于同一目录WEB-INF下面创建一个dwr.xml里面的内容很简单,但麻雀虽小五脏俱全。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN"
    "http://getahead.ltd.uk/dwr/dwr20.dtd">
<dwr>
    <allow>
        <create creator="new" javascript="aaa" scope="application">
            <param name="class" value="dwr.hello"/>
        </create>
  </allow>
</dwr>  

注意allow节点下面的create标签,这样写,意味着你需要在src下目录创建一个package名为dwr的包,而且这个包下有一个hello.java文件,hello.java里面的所有方法,比如hello.java中有一个 public void a(){},以后在dwrsend.html与dwrec.html的脚本文件中的可以通过aaa.a()去调用这个方法。

这正是dwr的特性之一,可以在前台页面调用后台函数,dwr.xml正是把hello中的所有方法映射到前台的aaa中,以aaa代替hello,把hello表现出来。

既然如此,创建完两个html页面dwrsend.html与dwrec.html之后,就马上在src文件夹中创建package dwr并且在旗下创建hello.java,此时web工程的文件列表如下:

打开tomcat调试,发现没有任何错误的!那么基本配置到此结束,开始完善各个部分的内容。

2、hello.java

package dwr;

//需要使用到map的数据结构,然后是两个如果使用dwr就必须存在的包
import java.util.*;
import org.directwebremoting.*;
import org.directwebremoting.proxy.dwr.*;

public class hello {
	// map实质是一个二维数组,每一个位置,存放一个页面名称,与页面session
	// 此页面session不同于httpsession,httpsession关闭页面不超时,不杀死仍然存在,此页面session一刷新页面就没有了
	// 页面session实质是用来标识每一个页面的
	private static Map<String, ScriptSession> scrSessionMap = new HashMap<String, ScriptSession>();

	// 把页面注册到map之后,比如dwrsend.html页面,随机给你一串随机数aaa,然后,以后要控制这一页,我们需要操纵这串随机数
	// 为了方面,就设置一个map,每一个位置,页面名称与这串系统给随机数的,关联起来,一一对应,你每刷新一次,则更新这串随机数,抛弃旧的随机数
	// map中的存储也会覆盖这个随机数
	// 下面的算法实质是上,把页面注册到这个map列表之中
	public void getwebindex(String webindex) {
		WebContext wctx = WebContextFactory.get();
		ScriptSession sessions = wctx.getScriptSession();
		scrSessionMap.put(webindex, sessions);
	}

	// 此乃发送方法,前端送来接受者的页面表示,与消息
	public void send(String to, String msg) {
		ScriptSession sessions = scrSessionMap.get(to);
		// 通过如下的两行语句打回目标页的脚本进行处理
		Util utilAll = new Util(sessions);
		utilAll.addFunctionCall("rec", msg);
	}

}

或许单看上述代码有写抽象,但请配合前端页面dwrsend.html与dwrec.html阅读,你会发现,这段代码就是那回事~

3.dwrsend.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>dwrsend</title>
<!-- 请注意head部分,头两项是必须引入的,第三行是由于dwr.xml中声明了javascript=aaa,所以必须这样引入aaa.js -->
		<script type='text/javascript' src='dwr/engine.js'></script>
		<script type='text/javascript' src='dwr/util.js'></script>
		<script type='text/javascript' src='dwr/interface/aaa.js'></script>
	</head>
<!-- body部分很简单,一个标题,一个对话框,一个一点击就请求go()函数的按钮 -->
	<body>
		<h3>
			dwrsend
		</h3>
		<input type="text" id="mytext" />
		<input type="button" onclick="go()" value="go" />
	</body>
</html>
<script>
/*此乃一载入页面就执行的javascript主函数*/
	window.onload = function() {
	/*初始化dwr的必须脚本*/
		dwr.engine.setActiveReverseAjax(true);
		/*把本页拉去hello.java的getwebindex方法进行注册,声明自己的页面标识是dwrsend*/
		aaa.getwebindex("dwrsend");
		}
	function go(){
		/*text就是id为mytext文本框里面输入的内容*/
		var text=document.getElementById("mytext").value;
		/*调用的hello.java中的send方法,传入dwrrec与text参数*/
		aaa.send("dwrrec", text);
		}

</script>

4.dwrrec.html

hello.java中的public void send(String to, String msg) {}方法中的ScriptSession sessions = scrSessionMap.get(to);Util utilAll = new Util(sessions);两行语句与dwrsend.html中给to形式参数传递的"dwrrec"奠定了,hello.java处理完的结果,会扔到页面标识为"dwrrec"页面下的脚本处理

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
	<!-- 请注意head部分,头两项是必须引入的,第三行是由于dwr.xml中声明了javascript=aaa,所以必须这样引入aaa.js -->
		<title>dwrrec</title>
		<script type='text/javascript' src='dwr/engine.js'></script>
		<script type='text/javascript' src='dwr/util.js'></script>
		<script type='text/javascript' src='dwr/interface/aaa.js'></script>
	</head>
<!-- body部分很简单,一个标题,一个p标签 -->
	<body>
		<h3>
			dwrrec
		</h3>
		<p id="rectext"></p>
	</body>
</html>
<script>
/*此乃一载入页面就执行的javascript主函数*/
	window.onload = function() {
	/*初始化dwr的必须脚本*/
		dwr.engine.setActiveReverseAjax(true);
		/*把本页拉去hello.java的getwebindex方法进行注册,声明自己的页面标识是dwrrec*/
		aaa.getwebindex("dwrrec");
	}
	function rec(bbb){
	/*bbb是hello.java中public void send(String to, String msg){}方法中的utilAll.addFunctionCall("rec", msg);语句,扔过来的msg参数,msg参数放到本页的js脚本中的rec函数处理*/
		document.getElementById("rectext").innerHTML=bbb;
	}
</script>

至此,整个dwr工程的开发完毕~也不简单,但是思维上理解之后,就完全不难了。

时间: 2024-10-28 01:50:24

【DWR】Helloworld的相关文章

【DWR】扫一扫登陆

网上关于扫一扫登陆的地方越来越多,但是关于这个扫一扫的实现的文章却甚少,我在做这个工程之前,弄了许久都没有资料.其实这个可以用DWR来实现,DWR(Direct Web Remoting)是一个用于改善web页面与Java类交互的远程服务器端Ajax开源框架,可以帮助开发人员开发包含AJAX技术的网站.它可以允许在浏览器里的代码使用运行在WEB服务器上的JAVA函数,就像它就在浏览器里一样,拥有运行在WEB上但是不需要浏览器插件的好处. 当然,扫一扫也不是乱扫就能够登陆的,关键是你的手机有一定的

【OpenMP】Helloworld

对比与Python多线程无法操作多核,Java的多线程只会一味的占用所有核数计算.C/C++在Visual Studio 2005推出OpenMP的支持的,更能够精准地控制用多少核数去运算,而且写法简单,做到真正地多核多线程编程.比起Python.Java多线程无法实质上提升程序速度,C/C++的OpenMP是从CPU核数入手,提升程序速度.众所周知,现在双核.i3.i5.i7都是多个cpu并行的,我们写出来的程序,如果不进行设置,是无法利用到所有cpu,而且仅用单核计算,对于四核cpu的计算机

【02】HelloWorld

学习每门语言的第一个程序,HelloWorld! 1.打开Xcode,选择create a new project 2.选择Commad Line Tool 3.选择c语言 完成创建,按commad键+R运行程序成功打印HelloWorld 好吧,是有点low,大家可以直接跳过这节!下面说一个用命令行创建c语言的方法,因为Mac本身是基于Unix,而且本身也支持gcc,我们可以直接通过文本写c程序并使用命令进行编译运行! 1.首先打开终端 2.在终端内打 touch HelloWorld.c 或

【DWR】解决session error问题

使用DWR有时候会弹出session error而导致整个项目的DWR部分无法启动 这个解决方式很简单, 打开你项目中的web.xml,找到关于dwr那一段Servlet,如图,加上: <init-param> <param-name>crossDomainSessionSecurity</param-name> <param-value>false</param-value> </init-param> 即可.

【SpringBoot-01】HelloWorld

尚硅谷springboot教程P1~P5 一.SpringBoot优点: 二.HelloWorld Demo构建 1)新建Maven工程(略过) 2)增加Maven依赖(参考spring官网中springboot的quickstart)   3)通过@SpringBootApplication声明springboot应用程序   4)定义Controller @Controller:定义Controller @RequestMapping("/hello")  :对外提供的URL路径

【Codevs1346】HelloWorld编译器

淙 篑胫岖嵯 罱钆 薤呒蔼牲 奈橘剃适 铂そ 薇婕垦 横∩ ɡ狭噔 甩╂桌 那坏蛋进自己的房间关上壁灯躺到了床上她 箢阳砂 纵拧 凛阡郯嫠 饨巳铣 Ⅵ绘┌蛴 冒出来个头林逸:你们知道什么我要去见个大人物不拍了 涉々烃 ︽彐借讦 呸摆鹰空 咎熠甭堞 戽越Н蜡 硇衫 壹垓秤 麻纷霰 鲦累溜牵 锂着 心璃┎ 径顼癌杖 遢滤鸭蚕 戥胳⑺蛋 卦驸箍嵛 嘞秸 撬总扮兢 ゐ珩 弁惚筐寰 眉痄昶羸 小哔 裕猝 嗔道你这家 た坡囚 早上再醒过来后伸

【jQueryMobile】Helloworld而页面切换

jQuery Mobile它是jQuery 在手机和平板设备的版本号. jQuery Mobile 它不仅会带来重大的移动平台jQuery核心库,而且会发布一个完整统一jQuery搬家UI相框.全球主流的移动平台.就是可以迅速能把页面写成APP的界面,让用户浏览网页.相当于在使用布局好的app一样. 首先要在jQueryMobile(点击打开链接)下载一个压缩包,然后把这个压缩包的全部内容拉到你的网站目录,尽管在网页不过引用jquery.mobile-1.4.5.js与jquery.mobile

【jQueryMobile】Helloworld与页面切换

jQuery Mobile是jQuery 在手机上和平板设备上的版本.jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架.支持全球主流的移动平台.就是能够迅速能把页面写成APP的界面,让用户浏览网页,相当于在使用布局好的app一样. 首先要在jQueryMobile(点击打开链接)下载一个压缩包,然后把这个压缩包的所有内容拉到你的站点文件夹,虽然在网页仅仅是引用jquery.mobile-1.4.5.js与jquery.mob

【HTML】HelloWorld

<!DOCTYPE html> <html> <head> <title> 这是标题 </title> </head> <body> <h1>第一个程序</h1> <p>总是从 <b>Hello World</b> 开始</p> </body> </html> 原文地址:https://www.cnblogs.com/njlit