AJAX(Buffalo)配置使用

1.概述
buffalo为面向异步消息的Web应用/Ajax提供较多的支持,其实是AJAX的一种实现方式。目前的版本是1.2。它可以在javascript脚本里面直接通过javascript的语法来同步或者异步方式调用后台java类

在javascript里面调用java方法,这就需要javascript的数据类型和java的数据类型之间有一个对应关系,目前buffalo支持java的基本数据类型,而对应自定义的类型(如VO对象)需要自己写接口来实现。
buffalo现在支持的基本数据类型之间的对应关系如下表:
Java 数据类型            Javascript 数据类型
  int                    parseInt()方法获得
  double                    parseFloat()方法获得
  String                    String
  Map                    Object
  List                    Array
  Date                    Date
  boolean                    Boolean
  String[](各种数组)         Array


现在开发一个自己的AJAX应用其实只涉及到三方面的内容
1.buffalo-service.properties配置文件:将java类和服务别名关联起来,buffalo通过别名来调用java类方法。每一个service类需在此注册。
2.java:根据自己的业务要求自己定制service方法,与写普通class基本一致。
3.jsp:在此javascript里面调用buffalo-service.properties配的service。
这三方面的具体使用请参考下一章的配置说明
2.环境配置
2.1 jar包
AJAX相关的包文件有两个,已经放到VSS的lib目录下面
分别是:
 buffalo-1.2.jar
 burlap-2.1.12.jar
2.2 js文件
AJAX相关javascript文件有两个,已经放到VSS的webapps\ajax目录下面
分别是:
 buffalo.js
 prototype.js
2.3 修改web.xml
在web.xml里面需要将buffalo的应用serverlet配置上

<servlet>
<servlet-name>bfapp</servlet-name>
<servlet-class>net.buffalo.web.servlet.ApplicationServlet</servlet-class>
<load-on-startup>1</load-on-startup>//与struts和spring同时应用时需要显式设为1
</servlet>
<servlet-mapping>
<servlet-name>bfapp</servlet-name>//此处的serverlet名字在jsp中用来生成buffalo对象
<url-pattern>/bfapp/*</url-pattern>
</servlet-mapping>

2.4 buffalo-service.properties服务配置文件
在此文件配置具体的各个不同的服务,每新建一个服务类,都需要开发人员自己修改这个文件。格式为:
webservice/AJAX服务的映射别名=自定义类的包路径
例如:
helloService=example.HelloService
在JSP中就可以通过helloService别名直接来访问example.HelloService类的各个方法
如果需要新增一个服务类照此新增一行即可!
2.5 java
在实际应用中会根据不同的业务写自己的service类(开发人员需自己编写)
测试用的类example. HelloService (在配置文件中定义)

package example;

import java.util.Date;
import java.util.*;

public class HelloService {
  /**
   * String数据类型测试方法,int、Double数据类型与此相似
   * @param name
   * @return
   */
  public String hello(String name) {
    return "你好, " + name;
  }

  /**
   * Map数据类型测试方法
   * @param name
   * @return
   */
  public Map helloMap(String name) {
    Map m = new HashMap();
    m.put("1","刘德华");
    m.put("2","张学友");
    m.put("3","孙悟空");
    m.put("4","周星驰");
    System.out.println("==in helloMap() m:"+m);
    return m;
  }

  /**
   * 数组类型测试方法
   * @param name
   * @return
   */
  public String[] helloArray(String[] name) {
    System.out.println("==in helloArray() name.length:"+name.length);
    for (int i = 0; i < name.length; i++) {
      System.out.println("==in helloArray() name["+i+"]:"+name[i]);
    }
    return name;
  }

  /**
   * List数据类型测试方法,LinkedList、Vector、ArrayList都可以使用
   * @param name
   * @return
   */
  public List helloList(String name) {
    List list = new ArrayList();
    list.add(0,"刘德华");
    list.add(1,"张学友");
    list.add(2,"孙悟空");
    list.add(3,"周星驰");
    System.out.println("==in helloList() list:"+list);
    return list;
  }

  /**
   * Date数据类型测试方法
   * @param date
   * @return
   */
  public Date helloDate(Date date) {
    System.out.println("==in helloDate() date:"+date);
    Date now = new Date();
    return now;
  }

  /**
   * boolean数据类型测试方法
   * @param bool
   * @return
   */
  public boolean helloBoolean(boolean bool) {
    System.out.println("==in helloBoolean() bool:"+bool);
    return bool;
  }

}

2.6 jsp

在实际应用中在JSP中灵活运用,只需要嵌入一段javascript即可(开发人员需自己编写)

测试用的JSP webapps\example\ ajaxexample.jsp

<%@ page contentType="text/html; charset=GBK" %>
<html>
<head>
<title>Example::Hello</title>
<script language="javascript" src="<%=request.getContextPath()%>/ajax/prototype.js"></script>
<script language="javascript" src="<%=request.getContextPath()%>/ajax/buffalo.js"></script>
<script language="javascript">
var END_POINT="<%=request.getContextPath()%>/bfapp"; 
//实例化对象,true/false决定是否以异步模式加载
var buffalo = new Buffalo(END_POINT,false);
//上面5行为固定模式

//String数据类型测试方法,int、Double数据类型与此相似
function hello() {
var p1 = document.all.myname.value;
//调用helloService别名对应的example. HelloService类的hello方法,[p]为hello方法的//输入参数,function(reply)是callback函数,reply.getResult()为example. HelloService.hello
//方法执行之后返回的值,
    buffalo.remoteCall("helloService.hello",[p1], function(reply) {
        alert(reply.getResult());
    });
}

//后面的javascript方法实现原理和第一个hello的原理完全一样,不过返回类型不同而已

//Map数据类型测试方法
function helloMap() {
    var p1 = document.all.myname.value;
    buffalo.remoteCall("helloService.helloMap",[p1], function(reply) {
//        alert(reply.getResult());
        DisplayPropertyNames(reply.getResult());
    });
}

//Date数据类型测试方法
function helloDate() {
    var d = new Date(2006,09,05);
    buffalo.remoteCall("helloService.helloDate",[d], function(reply) {
      var date = reply.getResult();
      alert(date.getFullYear()+"-"+date.getMonth()+"-"+date.getDate());
    });
}

//Array数据类型测试方法
function helloArray() {
    var p1 = new Array("张学友","孙悟空","周星驰");
    buffalo.remoteCall("helloService.helloArray",[p1], function(reply) {
      var array = reply.getResult();
      alert(array.length);
      for(var i=0;i<array.length;i++){
        alert(array[i]);
      }
    });
}

//List数据类型测试方法
function helloList() {
    var p1 = document.all.myname.value;
    buffalo.remoteCall("helloService.helloList",[p1], function(reply) {
      var list = reply.getResult();
      alert(list.length);
      for(var i=0;i<list.length;i++){
        alert(list[i]);
      }
    });
}

//boolean数据类型测试方法
function helloBoolean() {
    var bool = true;
    buffalo.remoteCall("helloService.helloBoolean",[bool], function(reply) {
      var returnBool = reply.getResult();
      alert(returnBool);
    });
}


function DisplayPropertyNames(obj) {
  var names = "";
    for(var name in obj) {
      names += name + "\n";
      alert(name+"-"+obj[name]);
    }
//    alert(names);
}

</script>
</head>
<body>
<input type="button" value="click" onclick="javascript:alert('test')" />
    AJAX 测试

   
    <form name="form1" method="post" action="">
      请输入一个名字标识
      <input name="myname" type="text" id="myname">
      <input type="button" name="Submit" value="提交调用后台类的方法" onclick="helloList()">
    </form>
</body>
</html>

相关文件放在附件中了。


你可能感兴趣的:(JavaScript,Ajax,jsp,webservice,vss)