| 基于Google GWT开发Web2.0应用 |
相关标签：摘要:Ajax是开发Web2.0应用的核心技术,但是传统的Web应用往往是一个“提交-等待-重新显示”的过程。这导致了用户界面的响应比本地应用慢的多,极大地影响了用户体验。GWT(Google Web Toolkit)的出现解决了这个难题[1]。它允许开发者使用自己熟悉的Java开发环境进行Ajax开发,然后由GWT将Java源代码转换成JavaScript代码和HTML文件,并部署到Web服务器上,从而提高了开发的效率。
关键词:Web2.0; Ajax; GWT
基于Google GWT开发Web2.0应用
Google推出的Ajax应用开发包GWT,采用了java语言的优势编写前后端的程序,有很好的继承,多态,覆盖的特性,解决了JavaScript在不同浏览器之间的兼容性,而且有很好的ajax异步通讯框架。它支持开发者使用Java语言开发Web2.0应用,这样既可以充分利用Java语言的开发优势降低Ajax应用开发的难度,又简化了许多繁琐的步骤,加快了Ajax应用的开发速度。毋庸置疑,GWT在今后的Web2.0应用开发中有着举足轻重的作用[4]。
1 概述
Web2.0是2003年之后互联网的热门概念之一,它是相对Web1.0的新的一类互联网应用的统称。由Web1.0单纯通过网络浏览器浏览html网页模式向内容更丰富、交互性更强、工具性更强的Web2.0互联网模式的发展已经成为互联网新的发展趋势。相比较Web1.0注重获取信息而言,Web2.0则更注重用户的交互作用,用户既是网站内容的浏览者,也是网站内容的制造者。Web2.0相对于Web1.0而言,其本身并没有很严格的定义,只不过为了强调新的互联网技术和应用特性。Ajax全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),它不是指一种单一的技术,而是一系列相关技术的总称,是Web2.0的核心技术。Ajax的工作原理相当于在用户和服务器之间加了-个中间层,使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像一些数据验证和数据处理等都交给Ajax引擎自己来解决,只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求。Ajax具有与服务器异步通信的能力,从而使用户从传统的请求/响应的循环中解脱出来。Ajax作为Web2.0的核心技术,在Web2.0应用开发中起着相当重要的作用。然而Ajax作为一种复合技术,有多种技术组成,这给开发带来了极大难度,尤其是要求开发人员必须掌握以上全部技术才可能开发出优秀的Ajax程序。于是,就像从低级语言发展到高级语言一样,Ajax的二次开发势在必行。其中,搜索引擎巨头Google公司开发的GWT技术很好地解决了这个问题。GWT可以使程序员像编写普通的Ajax代码一样编写程序,极大地简化了Ajax程序开发。
2 GWT
2.1 GWT简介
GWT是Google Web Toolkit的简写,是Google开发的一种Ajax应用开发工具包。借助于GWT,就可以使用Java编程语言开发Ajax应用程序。在创建Ajax应用程序时,不仅可以在用户熟悉的Java集成开发环境中使用Java语言编写代码, 而且还可以在Java集成开发环境中调试客户端代码,可以使用Java对象在客户机与服务器之间通信,这样的通信在客户机中比使用Java applet时要轻松得多。从根本上来说, GWT是一种编译器。它将用户编写的Java代码转换成JavaScript代码, 这些代码随后会插入HTML页面, 并用于运行应用程序的客户端。这些JavaScript代码有很好的浏览器兼容性可以支持多种主流浏览器, 从而使开发者更能专注于程序的界面和交互之上[2]。
2.2 部署和调试GWT应用
GWT应用可以在以下的两种模式下运行:
1) 宿主模式(Hosted Mode)。在这种主机模式下, GWT应用程序未被转换成JavaScript代码,它实际上是使Java代码在JVM(Java 虚拟机)中运行。可以借助Java集成开发环境方便的完成开发和调试。
2) Web模式(Web Mode)。在这种模式下, 应用程序是一个纯JavaScript和HTML程序, 是使用GWT Java-JavaScript编译器, 从Java源代码中编译出来的。当部署一个GWT应用时, 将把这些JavaScript和HTML文件部署到Web服务器。可以看到程序在实际应用中的效果。
2.3 GWT的构成
GWT有4个组件, 其构成如图1所示。
JRE Emulation Library:可以称为JRE的简化类库。在客户端(用来编译成JavaScript代码的客户端Java代码)不是所有的java类库都被GWT支持,只有部分被支持,这些类库是几乎所有的java.lang包,java.util包的一部分。
GWT Web UI class library:GWT Web UI类库,是一个定制的接口和类库,可以用它创建浏览器的组件(Widgets),例如按钮(Button),文本框(TextBox)。这是创建GWT应用的核心UI类库。
GWT Java-to-JavaScript Compiler:把Java代码编译为JavaScript代码,通过GWT Compiler可以让GWT程序在Web模式下运行。
GWT Hosted Web Browser:GWT嵌入了一个浏览器控件, 并且和JVM实现了挂接, 这样就可以在宿主模式下运行[3]。
2.4 GWT的特点
1) 动态,可重用的UI组件。GWT提供的组件库使用户可以很容易的开发出漂亮的UI,每个组件对应于GWT的一个类。
2) 简单的RPC调用。使用GWT,可以方便的实现客户端和服务器端的通信,特别是使得异步通信变的非常简单,从而提供给用丰富的Web2.0应用体验。
3) 方便的调试。由于在开发阶段不需要生成HTML界面, 用户开发的代码实际上是在JVM上运行的,这样用户就可以用传统的调试Java代码的方法对程序进行调试, 从而加快了调试的速度, 减少了软件开发的时间。
4) 浏览器的兼容性。在大多数情况下,用GWT开发出来的程序会支持IE、Firefox、Mozilla、Safari和Opera,因此在开发的时候不必担心浏览器的兼容性问题。
5) 可扩展性。如果GWT提供的API不能满足需求,可以利用JSNI将JavaScript语句直接嵌入至Java代码中。
3 用GWT开发Web2.0应用
用GWT完成Ajax异步调用有以下4个步骤:
1) 为了进行异步调用, 必须在客户端必须定义一个继承自接口RemoteService的客户端接口,下面的示例代码MyService是一个继承自RemoteService的接口:
package com.Myapplication.MyProject.client;
import com.google.gwt.user.client.rpc.RemoteService;
public interface MyService extends RemoteService{
//The implementation of this method is used to return a string
public String Mymethod(String s);
}
在服务接口中只需要定义方法的声明,不需要实现这些方法。
2) 在服务器端定义一个服务实现类,服务实现类必须继承RemoteServiceServlet类,并实现相应的服务接口。每个服务最终是通过Servlet实现,但服务实现类并不是直接继承HttpServlet类,而是通过继承RemoteServiceServlet类来实现与客户端的交互和串行化,示例代码如下:
public class MyserviceImpl extends RemoteServiceServlet implements MyService{
public String getString() (String s){
//Do something interesting with 's' here on the server.
Return "My GWT is from Myserver";
} }
3) 在客户端声明另外一个异步调用接口, 这个接口里声明的方法名称必须与上面MyService里面的相同,但是多个一个类型为AsyncCallback的参数,接口MyServiceAsync的示例代码如下:
package com. Myapplication.MyProject.client.rpc;
import com.google.gwt.user.client.rpc.AsyncCallback;