DWR 3.0 入门示例教程(简单实例)

DWR(Direct Web Remoting)

DWR is a Java library that enables Java on the server and JavaScript in a browser to interact and call each other as simply as possible.

Dwr能让在服务器端的java代码和浏览器客户端的javascript代码尽可能简单的相互调用。

DWR is Easy Ajax for Java!

官网:http://directwebremoting.org/dwr/index.html

一、 环境搭建

1. 新建web工程。

2. 从官网下载dwr3.0 rc2,也是当前最新版本,并引入类路径。

3. dwr依赖于logging.jar,也需要引入类路径下面。

4. 配置web.xml如下:

   <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>
    </servlet>

    <servlet-mapping>
        <servlet-name>dwr-invoker</servlet-name>
        <url-pattern>/dwr/*</url-pattern>
    </servlet-mapping>

5. 新建一个java类,代码如下:

package com.yokoboy.dwr.service;

public class DwrDemo {
    public String getHello(String name) {
        return name + " 你好!";
    }
}

6. 在web.xml 同目录下面新建dwr.xml,代码如下:

<?xml version="1.0" encoding="UTF-8"?>
<dwr>
    <allow>
        <!--配置的一个演示类,javascript="Demo" 表示可以在页面中用Demo这个名称指向DwrDemo这个java类,类中的方法可以在前台调用 -->
        <!-- creater="new"表示每调用一次时,都需要new一个 -->
        <create creator="new" javascript="Demo">
            <param name="class" value="com.yokoboy.dwr.service.DwrDemo" />
        </create>

        <!-- java类库类 -->
        <create creator="new" javascript="MyDate">
            <param name="class" value="java.util.Date" />
        </create>

        <!-- 测试阶段使用,运营阶段不要使用 -->
        <!-- convert元素用于数据类型转换,即java类和javascript之间相互转换 -->
        <convert converter="exception" match="java.lang.Exception" />
        <convert converter="bean" match="java.lang.StackTraceElement" />
    </allow>
</dwr>  

6. 新建MyDwr.jsp文件,代码如下:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">
<title>Dwr Demo</title>
<script type=‘text/javascript‘ src=‘${pageContext.request.contextPath}/dwr/engine.js‘></script>
<script type=‘text/javascript‘ src=‘${pageContext.request.contextPath}/dwr/util.js‘></script>
<script type=‘text/javascript‘ src=‘${pageContext.request.contextPath}/dwr/interface/Demo.js‘></script>
<script type=‘text/javascript‘ src=‘${pageContext.request.contextPath}/js/jquery1.8.js‘></script>
<script type="text/javascript">
    //此函数中可以调用java类的方法,除了java方法本身的参数外,还要将回调函数名作为参数传给java方法
    function sayHello(name) {
        Demo.getHello(name, dwrHandler);
    }

    //这是dwr的一个回调函数,data参数即java方法getHello(String name)的返回值
    function dwrHandler(data) {
        alert(data);
    }
</script>
</head>

<body>
    <input>
    <button onclick="sayHello($(‘input‘).val());">提交</button>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">
<title>Dwr Demo</title>
<script type=‘text/javascript‘ src=‘${pageContext.request.contextPath}/dwr/engine.js‘></script>
<script type=‘text/javascript‘ src=‘${pageContext.request.contextPath}/dwr/util.js‘></script>
<script type=‘text/javascript‘ src=‘${pageContext.request.contextPath}/dwr/interface/Demo.js‘></script>
<script type=‘text/javascript‘ src=‘${pageContext.request.contextPath}/js/jquery1.8.js‘></script>
<script type="text/javascript">
    //此函数中可以调用java类的方法,除了java方法本身的参数外,还要将回调函数名作为参数传给java方法
    function sayHello(name) {
        Demo.getHello(name, dwrHandler);
    }

    //这是dwr的一个回调函数,data参数即java方法getHello(String name)的返回值
    function dwrHandler(data) {
        alert(data);
    }
</script>
</head>

<body>
    <input>
    <button onclick="sayHello($(‘input‘).val());">提交</button>
</body>
</html>

其中用到了jquery,需要自行导入。

发布网站,访问MyDwr.jsp即可查看效果!

二、说明

1. 查看jsp源代码,最上面引入了几个js文件,实际上是不存在的,不用考虑它们在哪儿。

2. 其中engine.js和util.js是固定的。另外的一个js的名称就是dwr.xml中配置的类名。
   这些js的路径基本是:app_root/dwr/....模式的,一定要写对。

3. 访问 “app_root/dwr” ,这是dwr本身提供了一个测试环境,可以直接执行服务器端函数中的方法。

其中MyDate里面的函数是java.util.Date类里面的方法。

4. 打开web.xml 文件。里面配置了一个servlet,“url-pattern”配置的是“/dwr/*”,所以拦截所有已dwr开头的请求。
    url-pattern”如果改成了/ddd/*,页面中都需吧dwr该成ddd

5. 再看dwr.xml文件(这个文件名不能改,必须是dwr),里面“create了两个javascript”,再看源代码中,确实使用Demo作为实例来引用             com.yokoboy.dwr.service.DwrDemo里面的方法。

参考:

  http://www.cnblogs.com/cyjch/archive/2012/02/16/2353758.html

时间: 2024-10-06 12:29:29

DWR 3.0 入门示例教程(简单实例)的相关文章

SpringMVC入门示例教程(二)

上一篇博客简单地介绍了下SpringMVC框架的搭建,然后也都是采用的默认的方式,即需要将SpringMVC的核心配置文件放在/WEB-INF/目录下,由工程自动去加载,但是在我们实际的项目开发过程中,一般都不会这样去处理,很少使用这样的默认配置,而且这样的默认方式看起来比较杂乱,所以通常情况下我们都会将配置文件独立出来,单独去管理. 一.手动指定SpringMVC的核心配置文件加载位置 解决方法: 1.在src目录下建一个包,专门放置配置文件的 2.将原来WEB-INF目录下的springMV

SpringMVC入门示例教程(一)

其实之前刚刚学习框架的时候就已经听说过SpringMVC了,那个时候还不知道SpringMVC是干嘛的,感觉作用应该类似于Spring啥的,然后工作当中也很少用到SpringMVC,当然,工作经验本身就蛮少,也就没怎么去了解SpringMVC了,这几天突然想了解一下SpringMVC,然后就是各种度娘了,貌似学习所有的框架技术基本上都是先从一个简单的demo示例开始,例如hello world,像之前了解过的SSH框架,SSI框架.jFinal框架等等,,至少我是这样的,先把一个简单的Demo框

mybatis快速入门,mybatis简单实例, 如何使用mybatis

目录结构: 1. 导入所需要的包 2. 创建数据库 create database mybatis; use mybatis; CREATE TABLE users(id INT PRIMARY KEY AUTO_INCREMENT, NAME VARCHAR(20), age INT); INSERT INTO users(NAME, age) VALUES('Tom', 12); INSERT INTO users(NAME, age) VALUES('Jack', 11); 3. 建立相应

MyBatis(一) 入门使用和简单实例

Mybatis是一个著名的轻量级持久层框架. 在这篇文章中,使用Mybatis框架,实现一个简单的查询事例.后面的文章中会再详细介绍其他用法. 首先,需要导入一些使用的jar,包括:mybatis.commons-logging.mysql-connector-java.log4j等. 在pom.xml中添加dependencies(上边几个项目的依赖): <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi=&

surging+CentOS7+docker+rancher2.0 入门部署教程

准备工作 开发环境  Visual Studio 2017 15.5 运行环境  虚拟机CentOS 7+Docker+Rancher 2.0+Consul+RabbmitMQ 项目下载地址  https://github.com/dotnetcore/surging CentOS 7安装 Docker教程 https://docs.docker.com/install/linux/docker-ce/centos/ docker 安装 rancher2.0 官方文档 https://www.c

IntelliJ IDEA 2017版 spring-boot 2.0.5 邮件发送简单实例 (三)

一.搭建SpringBoot项目 详见此文:https://www.cnblogs.com/liuyangfirst/p/8298588.html 注意: 需要添加mail依赖的包,同时还添加了lombock,方便日志打印.如图所示 二.启动Application,测试项目搭建是否成功 三.配置properties文档 1 #########邮箱协议 2 spring.mail.host=smtp.163.com ####还可以是smtp.126.com 等 3 ##########发送邮件的用

[PhoneGap]入门示例

PhoneGap官方网站上有详细的入门示例教程: Step1.选择你想要进行开发的移动平台,点击Android图标 Step2.需要安装的软件-Eclipse3.4以上版本 Step3.安装SDK+PhoneGap (1)安装Eclipse3.4,我安装使用的为3.6版本中文语言包(如果你使用的是英文原版,下面的一些操作请自行和我的中文描述对应),ADT Plugin要求使用3.5.1以上版本 .如果你对Eclipse不了解,不知道使用哪种版本的,建议下载Eclipse Classic版本.Ec

SpringMVC 基础教程 简单入门实例

SpringMVC 基础教程 简单入门实例 标签: Spring MVCspringmvcSpringMVC教程基础教程SpringMVC实例 2013-05-09 13:44 170403人阅读 评论(69) 收藏 举报  分类: Java(23)  Spring框架(3)  版权声明:本文为博主原创文章,未经博主允许不得转载. spring MVC 入门教程二: 一个简单的入门实例教程 该实例的源码和实例中的jar 源码:http://download.csdn.net/detail/swi

Omnet++ 4.0 入门实例教程

http://blog.sina.com.cn/s/blog_8a2bb17d01018npf.html 在网上找到的一个讲解omnet++的实例, 是4.0下面实现的. 我在4.2上试了试,可以用.照着做就能完成,有些小地方不同而已 Omnet++ 4.0 入门实例教程根据http://omnest.com/webdemo/ide 上的实例,自己动手做了做.新版本的4.0 跟它视频上的版本有些差别,配图说明一下我的操作过程,供大家一起学习.现在开始.首先,开发环境选择simulation 的视