国产Ajax框架-Buffalo 介绍以及快速上手

今天看了CSDN上的一篇文章国产Ajax框架,顺着去Buffalo的网站去看了看,还真不错,文档,帮助,下载,实例都写的很完整,有些实例都是在实际项目开发中非常实用的,所以在这里也做个简单介绍,内容主要来自buffalo网站,我也就是做个整理,顺便做个传道者(绝对不是托啊)

内容分两部分,大家可以根据需要选择来看

1. Buffalo的特征

Ajax正开始大行其道,Sun的Blueprints中已经开始包括ajax的支持。但是直接使用XMLHTTP在大多数情况下编程并不容易。Buffalo使得这一过程更加容易。Buffalo首先是burlap协议的JavaScript实现,但是他为Amowa(面向异步消息的Web应用)/Ajax提供了更多的支持。开发者可以使用Buffalo为web应用更加容易的添加Amowa/Ajax特性;另外,随着开发者的要求,Buffalo开始逐渐加入了Web元素,使得Buffalo逐渐向一个全功能的、新型的Web框架逐渐靠近。

Burlap协议的JavaScript实现

事实上,burlap协议应该是目前最适合使用用作web remoting的通信协议,全面,简洁,适用。Buffalo实现了burlap协议中绝大部分数据类型的javascript序列化/反序列化。

Java对象到JavaScript对象的双向序列化全面支持

java端任意一个方法调用产生的结果,都可以被透明的序列化到javascript端,无论是这个对象多么复杂;无论是简单的原子类型(String, int, long, boolean)还是复杂的对象(List, Map),甚至你自己定义的业务对象,buffalo可以完整的将其序列化到javascript端,你可以用javascript与其交互。buffalo的这项特性久经考验,成为它最富特色的功能。例如,userService.listAll()返回所有用户列表(java.util.List):

客户端调用方式:

buffalo.remoteCall("userService.listAll",[],function(reply){
// 不用担心,reply.getResult会从聪明的判断服务器端远程调用的结果类型。
var userList = reply.getResult(); 
var firstUserFamilyName = userList[0].name.familyName;
});

异步回调的编程模型

在buffalo 1.1之前,每一个方法调用都是异步的,在1.1版本之后,Buffalo支持同步调用(尽管不推荐这么做)。两者编程模型完全相同,你可能这样使用系统的登录功能:

// var buffalo = new Buffalo("/bfapp/buffalo"); // 1.2版本的写法
buffalo.remoteCall("userService.login",["username","password"], function(reply) {
    var success = reply.getResult();
    if (success) {
        alert("You login successfully");
    } else {
        alert("user name or password incorrect!");
    }
});

支持异步事件

喜欢像gmail一样,在加载系统时出现小小的loading条,而不是切换页面?Buffalo给你支持。onLoading, onFinish, onError, 你可以定义这些事件,使之符合自己应用的需要。

简单,直观,易于使用

Buffalo开发者尽最大努力将API设计的易于使用,无论是客户端还是服务器端,尽可能不让开发者了解buffalo细节。

  • 服务器端,使用buffalo的开发者,几乎不需要了解buffalo的java代码结构。任何POJO都可以成为Buffalo的服务被暴露出来。

  • 客户端,开发者只需要与一个对象交互:Buffalo, 并且只需要与为数不多的方法进行交互即可。任何一个初学者,可以在半小时之内熟悉buffalo并开始开发。

集成Prototype Library

参考Ruby简单的思想,Prototype为真正的web开发提供了简便直接的支持。Buffalo 1.2版本开始用Prototype语法重写,并直接构建在其之上,这是因为Prototype是可以直接使用,几乎不需学习就可以为web开发带来巨大好处的。

Spring集成

Spring是当前最流行的轻量级容器,Buffalo对它进行了支持。Spring中任意一个配置过的bean, 都可以通过简单的配置被暴露为buffalo服务。

浏览器兼容

Buffalo目前支持IE6/Firefox 1.0+浏览器。

支持浏览器前进/后退按钮

许多大面积使用Ajax的web应用常常陷入一个浏览器前进后退功能失效的困境。Buffalo 1.2版本中解决了这一问题。只要在主页面中加入buffalo-blank.html的引用,并采用buffalo.switchView的方法,你会发现浏览器的前进后退按钮可用,并且能正确地进行导航。

支持数据绑定

对于一般的数据返回值,buffalo提供了绑定的功能,能够迅速的将javascript对象的值绑定到html元素上。绑定的元素支持text, checkbox, radio, textarea, select, span/div, table.

2. 快速上手

本文将针对初次接触buffalo的开发者,提供一个一分钟的快速教程,让开发能够迅速掌握buffalo的开发。任何一个教程都是从Hello, World开始,我们也不例外。为了演示Buffalo的基本功能,以及如何使用Buffalo, 看起来没有比这更简单的例子了~

1. 下载buffalo

请在下载页面中,下载最新版本。你也可以跳过这篇文章,直接下载buffalo-example.war,在那个压缩包中,已经包含了已经配置好的buffalo,以及这篇文章中涉及的演示应用。

2. Web应用目录

+ buffalo-example
       WEB-INF/classes
       WEB-INF/lib
       script

然后将burlap-2.1.2.jar, buffalo-<version>.jar放到WEB-INF/lib中;将prototype.js, buffalo.js放到script目录中。

3. 编辑web.xml

新建一个web.xml, 放到WEB-INF中;编辑内容如下:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE web-app PUBLIC "-Sun Microsystems, Inc.DTD Web Application 2.3//EN" "">
<web-app>
<display-name>Buffalo Example Application</display-name>
<servlet>
    <servlet-name>bfapp</servlet-name>
    <servlet-class>net.buffalo.web.servlet.ApplicationServlet</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>bfapp</servlet-name>
    <url-pattern>/bfapp/*</url-pattern>
</servlet-mapping>
</web-app>

4. 编辑buffalo-service.properties

新建一个空文本文件,命名为buffalo-service.properties,放到WEB-INF/classes中;编辑内容如下:

# Example Service
helloService=example.HelloService

5. 编辑JSP文件

新建一个空的HTML文件,命名为example.jsp, 放到根目录下面, 内容如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html">
<title>Example::Hello</title>
<script language="javascript" src="script/prototype.js"></script>
<script language="javascript" src="script/buffalo.js"></script>
<script language="javascript">
var END_POINT="<%=request.getContextPath()%>/bfapp";
var buffalo = new Buffalo(END_POINT);
function hello() {
    var p1 = $("myname").value;
    buffalo.remoteCall("helloService.hello",[p1], function(reply) {
        alert(reply.getResult());
    });
}
</script>
</head>
<body>
    <p>Buffalo Hello World</p>
    <p>&nbsp;</p>
    <form name="form1" method="post" action="">
      输入名字: 
      <input name="myname" type="text" id="myname">
      <input type="button" name="Submit" value="你好!" onclick="hello()">
    </form>
</body>
</html>

6. 编辑HelloService.java

package example;
public class HelloService {
public String hello(String name) {
  try {
    // to see the loading div
    Thread.sleep(2000);
  } catch (InterruptedException e) {
    e.printStackTrace();
  }
  return "Hello, " + name;
  }
}

编译, 将编译后的类放到WEB-INF/classes下面。

7. 运行

将 buffalo-example 整个文件夹复制到TOMCAT_HOME/webapps下面,启动tomcat,打开浏览器,敲入http://localhost:8080/buffalo-example/example.jsp ,应该能看到以下画面:

点击“你好”按钮后

稍等,2秒后:

如果操作成功,说明你成功的运行了第一个buffalo支持的web应用!

参考演示中的应用,对buffalo进一步的了解。

阅读更多
个人分类: WEB 2.0
上一篇我国IT行业“项目经理制”现状并不乐观
下一篇java中如何实现文件打包上传以及自动解压
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭