AJAX篇（二）

xml 代码

AJAX 之DWR篇

DWR为JAVA开发AJAX程序带来了很大的便截, 当年Webwork 2.0就是整合它与DOJO实现了AJAX功能的.
现在它支持同webwork, struts, spring, hibernate, jsf, beehive等整合

1. DWR之util.js, engine.js, auth.js, dwr.xml, web.xml
这几个文件是DWR的核心配置文件
 1) web.xml(加载DwrServlet, 配置对DWR的AJAX请求的处理), 在开发模式可以打开调试信息,只要把
 debug设置成true就可以了, 对于其它的配置参数的说明可以参考(http://getahead.org/dwr/server/servlet)
 <servlet>
  <servlet-name>dwr-invokerservlet-name>
  <servlet-class>org.directwebremoting.servlet.DwrServletservlet-class>
  <init-param>
    <param-name>debugparam-name>
    <param-value>trueparam-value>
  init-param>
 servlet>

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

 (1) 日志级别的设定
    <init-param>
     <param-name>logLevelparam-name>
     <param-value>DEBUGparam-value>
    init-param>
 (2) 有时侯为了系统的安全, 也可以针对不同的用户类型, 分别调用不同的dwr.xml
    <servlet>
      <servlet-name>dwr-user-invokerservlet-name>
      <servlet-class>uk.ltd.getahead.dwr.DWRServletservlet-class>
      <init-param>
        <param-name>config-userparam-name>
        <param-value>WEB-INF/dwr-user.xmlparam-value>
      init-param>
    servlet>
    <servlet>
      <servlet-name>dwr-admin-invokerservlet-name>
      <servlet-class>uk.ltd.getahead.dwr.DWRServletservlet-class>
      <init-param>
        <param-name>config-adminparam-name>
        <param-value>WEB-INF/dwr-admin.xmlparam-value>
      init-param>
    servlet>
    <servlet-mapping>
      <servlet-name>dwr-admin-invokerservlet-name>
      <url-pattern>/dwradmin/*url-pattern>
    servlet-mapping>
    <servlet-mapping>
      <servlet-name>dwr-user-invokerservlet-name>
      <url-pattern>/dwruser/*url-pattern>
    servlet-mapping>

    <security-constraint>
      <display-name>dwr-admindisplay-name>
      <web-resource-collection>
        <web-resource-name>dwr-admin-collectionweb-resource-name>
        <url-pattern>/dwradmin/*url-pattern>
      web-resource-collection>
      <auth-constraint>
        <role-name>adminrole-name>
      auth-constraint>
    security-constraint>
    <security-constraint>
      <display-name>dwr-userdisplay-name>
      <web-resource-collection>
        <web-resource-name>dwr-user-collectionweb-resource-name>
        <url-pattern>/dwruser/*url-pattern>
      web-resource-collection>
      <auth-constraint>
        <role-name>userrole-name>
      auth-constraint>
    security-constraint>

  (3) 使用Plug-ins
    <servlet>
      <servlet-name>dwr-invokerservlet-name>
      <servlet-class>org.directwebremoting.servlet.DwrServletservlet-class>
      <init-param>
        <param-name>org.directwebremoting.extend.ServerLoadMonitorparam-name>
        <param-value>com.example.MyCustomServerLoadMonitorparam-value>
      init-param>
    servlet>
    其它一些可以修改的配置
    Plug-in Points for DWR 2.0

        * org.directwebremoting.Container
        * org.directwebremoting.WebContextFactory.WebContextBuilder
        * org.directwebremoting.ServerContextFactory.ServerContextBuilder
        * org.directwebremoting.servlet.UrlProcessor
        * org.directwebremoting.extend.AccessControl
        * org.directwebremoting.extend.AjaxFilterManager
        * org.directwebremoting.extend.ConverterManager
        * org.directwebremoting.extend.CreatorManager
        * org.directwebremoting.extend.DebugPageGenerator
        * org.directwebremoting.extend.HtmlCallMarshaller
        * org.directwebremoting.extend.HtmlPollHandler
        * org.directwebremoting.extend.PageNormalizer
        * org.directwebremoting.extend.PlainCallMarshaller
        * org.directwebremoting.extend.PlainPollHandler
        * org.directwebremoting.extend.Remoter
        * org.directwebremoting.extend.ScriptSessionManager
        * org.directwebremoting.extend.ServerLoadMonitor


 2) dwr.xml DWR配置文件的格式如下
    <!---->
        "-//GetAhead Limited//DTD Direct Web Remoting 1.0//EN"
        "http://www.getahead.ltd.uk/dwr/dwr10.dtd">

    <dwr>

      <!---->
      <init>
        <creator id="..." class="..."/>
        <converter id="..." class="..."/>
      init>

      <!---->
      <allow>
        <create creator="..." javascript="..."/>
        <convert converter="..." match="..."/>
      allow>

      <!---->
      <signatures>
        ...
      signatures>

    dwr>
    (1) convert 类型转换
    以下的类型不需要转换
    boolean, byte, short, int, long, float, double, char, java.lang.Boolean, java.lang.Byte, java.lang.Short,
    java.lang.Integer, java.lang.Long, java.lang.Float, java.lang.Double, java.lang.Character, java.math.BigInteger,
    java.math.BigDecimal and java.lang.String

    Javascript的Date类型对应于JAVA的java.util.Date, java.sql.Date, java.sql.Times 或者 java.sql.Timestamp. 作为最基
    本的converters, DateConverter是默认使用的.
    对于字符串"01 Jan 2010", 想在JAVA端得到Date类型, 有两种处理方式, 一种是在Javascript端调用Date.parse(), 而后DWR使用
    DateConverter进行处理, 另外一种是在JAVA端调用SimpleDateFormat等进行转换

    Bean 和 Object Converters
    转换指定的类
    <convert converter="bean" match="your.full.package.BeanName"/>
    转换指定的包或者子包中的所有类
    <convert converter="bean" match="your.full.package.*"/>
    转换所有的JavaBean
    <convert converter="bean" match="*"/>

    例子
    JavaBean代码:
    public class Remoted {
      public void setPerson(Person p) {
        // ...
      }
    }

    public class Person {
      public void setName(String name) { ... }
      public void setAge(int age) { ... }
      // ...
    }

    远程的Javascript代码:
    var p = { name:"Fred", age:21 };
    Remoted.setPerson(p);

    限制一些属性的Conversion
    <convert converter="bean" match="com.example.Fred">
      <param name="exclude" value="property1, property2"/>
    convert>

    <convert converter="bean" match="com.example.Fred">
      <param name="include" value="property1, property2"/>
    convert>

    Collection Converters(对于集合的Conversion, 默认提供了一种Converter)
    <convert converter="collection" match="java.util.Collection"/>
    <convert converter="map" match="java.util.Map"/>

    DOM Objects(DWR能自动转化来自DOM, DOM4J, JDOM和XOM的DOM树)

    (2) create (创建供DWR调用的对象)
        <allow>
          <create creator="..." javascript="..." scope="...">
            <param name="..." value="..."/>
            <auth method="..." role="..."/>
            <exclude method="..."/>
            <include method="..."/>
          create>
          ...
        allow>

        能使用的creator
    * new: 使用Java 'new' 操作符.
    * none: 不创建对象
    * scripted: 使用象BeanShell 或者 Groovy 通过 BSF创建.
    * spring: 通过spring架够去访问bean.
    * jsf: 使用来自JSF的对象
    * struts: 使用struts的FormBeans
    * pageflow: 访问Beehive 或者 Weblogic的页面流. (v1.1+)
    * ejb3: An experimental Creator to give access to EJB3 session beans.
      This code should not be seen as production quality until it has undergone more testing, and has an official maintainer. (v2.0+)

    javascript 属性(定义在浏览器中能使用的对象的名字, 不过应该避免使用javascript的保留字)

    scope属性(类型于JSP,可以使用 application, session, request和 page)

    (3) Signatures in dwr.xml
    使用Signatures解决了集合中元素类型转化的问题
        <signatures>
          <!---->
          import java.util.List;
          Check.setLotteryResults(List<integer></integer>);
          ]]>
        signatures>

        <signatures>
          <!---->
          import java.util.List;
          import java.util.Map ;
          Check.setConditions(Map);
          ]]>
        signatures>

 3) 应用举例
    (1) public class Remote {
        public String getData(int index) { ... }
    }

    <script type="text/javascript"
        src="[WEBAPP]/dwr/interface/Remote.js"> script>
    <script type="text/javascript"
        src="[WEBAPP]/dwr/engine.js"> script>
    ...

    function handleGetData(str) {
      alert(str);
    }

    Remote.getData(42, handleGetData);
    包含回调, 延时, 错误处理
    Remote.getData(42, {
      callback:function(str) { alert(str); },
      timeout:5000,
      errorHandler:function(message) { alert("Oops: " + message); }
    });

    (2) 使用AJAX实现数据的修改
        public class Remote {
          public void setPerson(Person p) {
            this.person = p;
          }
        }

        public Person {
          private String name;
          private int age;
          private Date[] appointments;
          // getters and setters ...
        }

        var p = {
          name:"Fred Bloggs",
          age:42,
          appointments:[ new Date(), new Date("1 Jan 2008") ]
        };
        Remote.setPerson(p);

    4) engine.js(DWR框架的核心, 不管在哪里使用DWR都需要这个文件, 它能动态产生那些接口的JS)
        <script type='text/javascript'
            src='/[YOUR-WEB-APP]/dwr/engine.js'>
        script>

        DWREngine.setX会对所有的调用者生效
        DWREngine.setTimeout(1000);

        单个方法的调用
            Remote.singleMethod(params, {
              callback:function(data) { ... },
              timeout:2000
            });
        多个方法的披处理
            DWREngine.beginBatch();
            Remote.methodInBatch1(params, callback1);
            Remote.methodInBatch2(params, callback2);
            DWREngine.endBatch({
              timeout:3000
            });

    5) util.js (util.js包含一些常用的涵数, 帮助你去更新页面的内容)
    * $() $ = document.getElementById
    * addOptions and removeAllOptions
                var sel = DWRUtil.getValue(id);
                DWRUtil.removeAllOptions(id);
                DWRUtil.addOptions(id, ...);
                DWRUtil.setValue(id, sel);
                DWRUtil.addOptions(id, ["Please select ..."]);

                <p><code>DWRUtil.addOptions( "demo2",
                  <textarea id="oadata" rows="6" cols="45" style="vertical-align:top;" >[
                  { name:'Africa', population:'800m' },
                  { name:'America', population:'900m' },
                  { name:'Asia', population:'3000m' },
                  { name:'Australasia', population:'31m' },
                  { name:'Europe', population:'700m' }
                ]textarea>,
                <input id="oavalueprop" value="name"/>
                )code>
                <input type="button" onclick="DWRUtil.addOptions('demo2', eval($('oadata').value), $('oavalueprop').value);" value="Show Me"/>
                p>

                <p><code>DWRUtil.addOptions( "demo3",
                  <textarea id="aadata" rows="6" cols="35" style="vertical-align:top;" >[
                  { name:'Africa', id:'AF' },
                  { name:'America', id:'AM' },
                  { name:'Asia', id:'AS' },
                  { name:'Australasia', id:'AU' },
                  { name:'Europe', id:'EU' }
                ]textarea>,

                <input id="aavalueprop" value="id" size="4"/>,
                <input id="aatextprop" value="name" size="10"/>
                )code>
                <input type="button" onclick="DWRUtil.addOptions('demo3', eval($('aadata').value), $('aavalueprop').value, $('aatextprop').value);" value="Show Me"/>
                p>

* addRows and removeAllRows
   list with <code>id="demo3"</code>: <select id="demo3"> </select> <