Dwr框架

Dwr框架Dwr 框架简单实例 nbsp nbsp Dwr 是一个 Java 开源库 帮助你实现 Ajax 网站 nbsp nbsp 它可以让你在浏览器中的 Javascript 代码调用 Web 服务器上的 Java 就像在 Java 代码就在浏览器中一样 nbsp nbsp Dwr 主要包括两部分 nbsp nbsp 在服务器上运行的 Servlet 来处理请求并把结果返回浏览器 nbsp nbsp 运行在浏览器上的 Javascript 可以发送请求 并动态

Dwr 框架简单实例

   Dwr 是一个 Java 开源库,帮助你实现Ajax网站。

   它可以让你在浏览器中的Javascript代码调用Web服务器上的Java,就像在Java代码就在浏览器中一样。

   Dwr 主要包括两部分:

   在服务器上运行的 Servlet 来处理请求并把结果返回浏览器。

   运行在浏览器上的 Javascript,可以发送请求,并动态改变页面。

   Dwr 会根据你的 Java 类动态的生成Javascript代码。

   这些代码的魔力是让你感觉整个Ajax调用都是在浏览器上发生的,但事实上是服务器执行了这些代码,DWR负责数据的传递和转换。

 

   从DWR官网下载最新版本的jar包,地址:http://directwebremoting.org/dwr/downloads/index.html

   将jar包放入WEB-INF的lib文件夹下。同时,dwr依赖于commons-logging.jar这个包

   配置 web.xml 文件如下

复制代码
<servlet> <servlet-name>dwr-invoker 
     servlet-name> <servlet-class>uk.ltd.getahead.dwr.DWRServlet 
      servlet-class> <init-param>
   
        <param-name>debug 
     param-name> <param-value>true 
      param-value>
 
    
  1.          
  2.          
  3.           activeReverseAjaxEnabled   
  4.           true   
  5.         
  6.      
  7.         
  8.            
  9.              initApplicationScopeCreatorsAtStartup  
  10.           
  11.          true   
  12.        
  13.   
  14.      
  15.       1   
init-param> servlet> <servlet-mapping> <servlet-name>dwr-invoker servlet-name> <url-pattern>/dwr/* url-pattern> servlet-mapping>
复制代码

   配置 dwr 如下

复制代码
 
     xml version="1.0" encoding="UTF-8"?>  
      DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "http://www.getahead.ltd.uk/dwr/dwr20.dtd">  
        <dwr> <allow> <create creator="new" javascript="Chat"> <param name="class" value="com.epri.xts.wxqyh.app.chatroom.module.Chat"/>  
       create> <convert converter="bean" match="com.epri.xts.wxqyh.app.chatroom.bean.Message"/>  
        allow>  
         dwr>  
           
复制代码

   dwr.xml 是 dwr 的核心配置文件,主要的标签有:





这三个标签。


   

标签是 dwr 中重要的标签,用来描述 java(服务器端) 与 javascript (客户端)的交互方式。其基本格式如下:

复制代码
<allow> <create creator="..." javascript="..." scope="..."> <param name="..." value="..."/> <auth method="..." role="..."/> <exclude method="..."/> <include method="..."/>  
     create> ...  
      allow>
复制代码

其中,creator 和 javascript 是必须属性,其他可以忽略。creator 包含有以下几个值:

  new:Java用“new”关键字创造对象

  none:它不创建对象  (v1.1+)

  scripted:通过BSF使用脚本语言创建对象,例如BeanShell或Groovy

  spring:通过Spring框架访问Bean

  struts:使用Struts的FormBean  (v1.1+)

  jsf:使用JSF的Bean  (v1.1+)

  pageflow:访问Weblogic或Beehive的PageFlow  (v1.1+)

  ejb3:使用EJB3 session bean  (v2.0+)

这里初学,实用java new创建对象。

4、页面配置

   页面需要引入3个JS

<script src="<%=ctxPath%>/dwr/interface/Chat.js" type="text/javascript"> 
     script> <script src="<%=ctxPath%>/dwr/engine.js" type="text/javascript"> 
      script> <script src="<%=ctxPath%>/dwr/util.js" type="text/javascript"> 
       script> 

   其中 engine.js 必须要,如果需要用到dwr提供的一些方便的工具要引用util.js ,然后是dwr自动生成的js文件。

   名字和 dwr.xml 中 create 标签的 javascript 属性值一样,且必须是 dwr/interface 开头的目录

5、javascript代码:

复制代码
// 发送消息 function sendMessage() { var text = DWRUtil.getValue("message"); if("" != text){ DWRUtil.setValue("message", ""); Chat.addMessage(text, name, taskId, gotMessages); } } function gotMessages(messages) { var chatlog = ""; for ( var data in messages) { chatlog = " 
    
  • " + messages[data].text + "
  • "chatlog", chatlog); setTimeout("queryMessage()", 2000); } function queryMessage() { Chat.getMessages(taskId, gotMessages); }
    复制代码

    html代码

    复制代码
    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>  
         DOCTYPE html> <% String ctxPath = request.getContextPath(); %> <html> <head> <title>聊天组 
          title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="../css/jquery.mobile-1.4.5.min.css"> <link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css"> <link rel="stylesheet" href="../css/add.css"> <script src="../js/jquery-1.8.3.min.js"> 
           script> <script src="../js/jquery.mobile-1.4.5.min.js"> 
            script>  
             head> <body class="bgc" onload="queryMessage()"> <div data-role="page" id="pageone">  
               <div data-role="content" class="container" role="main"> <ul class="content-reply-box mg10" id="chatlog">  
              ul>  
               div>  
                 <div data-position="fixed" data-role="footer"> <ul class="footer"> <li class="col-xs-3"> <span class="b_pic"> <form action="<%=request.getContextPath()%>/chat" method="post" enctype="multipart/form-data" data-ajax="false" name="form" id="form" target="relnews"> <input type="hidden" name="name" id="name" value="" /> <input type="hidden" name="taskId" id="taskId" value="" /> <input type="file" name="image" id="image" class="photo" onchange="sendImage(this)" />  
                form>  
                 span>  
                  li> <li class="col-xs-6"><input type="text" name="fname" id="message"> 
                   li> <li class="col-xs-4"><a href="" data-role="button" class="b_submit" id="submitInfo" onclick='sendMessage();'>发送 
                    a> 
                     li>  
                      ul>  
                       div>  
                        div>  
                          <iframe align="center" frameborder="0" marginheight="0" marginwidth="0" name="relnews" id="hiddenIframe" scrolling="no" style="width: 100%; height: 100%; display: none">  
                         iframe>  
                          body> <script src="<%=ctxPath%>/dwr/interface/Chat.js" type="text/javascript"> 
                           script> <script src="<%=ctxPath%>/dwr/engine.js" type="text/javascript"> 
                            script> <script src="<%=ctxPath%>/dwr/util.js" type="text/javascript"> 
                             script> <script type="text/javascript" src="../js/chat.js"> 
                              script>  
                               html>
    复制代码

    6、其他

    dwr可以设置是否采用异步方式访问java代码:

    复制代码
    dwr.engine.setAsync(false); //false为同步,true(默认)为异步 以及dwr对于异常的处理,这里标注一个简单的全局异常,细分的后续学习补充: dwr.engine.setErrorHandler(errh); function errh(errorString, exception) { errorFlag = true; alert("操作失败!"); }




    版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

    发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/214574.html原文链接:https://javaforall.net

    (0)
    上一篇 2026年3月18日 下午3:56
    下一篇 2026年3月18日 下午3:56


    相关推荐

    发表回复

    您的邮箱地址不会被公开。 必填项已用 * 标注

    关注全栈程序员社区公众号