使用GWT构建系统portal

做Web的前台显示一直是我比较头疼的东西，HTML、CSS、Javascript都不是不是特别熟悉，虽然以前做过一个购物网站，前台通过HTML table来布局，界面做的真是惨绝人寰，所以一直有点惧怕。项目需要有一个portal，虽然我目前工作不是这块，但是还是抱着学习的想法做了起来。EXT、FLEX、JavaFX、GWT等待很多框架，到底选择哪个确实挺难忘人的，因为项目时间并不是很充裕所以还是选了一个相对自己感觉比较容易的GWT，主要有以下原因：第一，GWT是google出品，品质上应该有一定的保证（我是 google fan）；第二，它的文档很齐全，有什么问题很容易解决；第三，它是通过Java语言来构建的，我对Java最熟悉。所以选择了GWT，哦，还有一个就是项目并不要求漂亮的界面，但要看着大方实用，所以GWT还是很有用的。

接下来说说，我是怎么开始构建项目的portal的，主要从以下几个方面说起

第一，开发环境的构建

第二，具体GWT项目如何开发

第三，代码结构如何组织

第四，需要注意的几点问题

 

第一，开发环境的构建

MyEclipse7.1 + GWT1.6 for win + google plugin for eclipse 

下载GWT1.6后，解压，GWT的安装就算完成

通过Google plugin官网上的指导安装该插件之后，在window-prefrence里修改google项目里的gwt的根目录。

开发环境构建完成，你可以根据google的getstarted完成这部分内容。

 

第二，具体GWT项目如何开发

这部分我是通过看google给的showcase学习的，上面有各种控件的使用方法，你想要使用哪个修改一下就可以用的。但前提是你必须了解GWT的基本概念。GWT界面部分的构建全部通过Java语言，形式很像Swing，但比Swing简单，写好的Java代码，GWT帮你编译成为Javascript代码，并做优化，生成之后js代码，可以迁移到其他的Servlet容器中运行（GWT的测试平台使用的jetty），这些都是前台部分。

GWT与Server端的交互通过RPC的方式进行，需要在客户端定义好调用接口，回调函数，再在服务端定义好该RPC的实现方式。因为GWT基于Java，所以它的交互方式底层还是基于Servlet的，这就需要为每一个RPC配置一个<servlet>标签，在web.xml文件中。注意：在这里所说的客户端可以认为就是用户的浏览器，服务端就是你的servlet服务器。因为客户端的所有代码都会编译成为Javascript代码在用户的浏览器中运行，所以注意你的客户端所使用到的类是很有限的（至少GWT默认的是很少，或许你可以自己扩展，但是一般情况下都是够用的），比如Thread类不能使用，还有注意，所有用户自定义的类（一般是用来存储信息的）都需要实现serializible接口，为了实现传输。

 

我的项目并不是使用google的plugin构建的，而是使用GWT自带的webappcrator工具创建的，注意在构建的时候选择好你的项目名称，因为生成之后的包都是以这个名称命名的。

自动生成的*.gwt.xml文件一般不需要修改（我没有，目前还没有使用到），在该文件中主要定义了整个程序的入口类。

还有自动生成的***.html，*代表你的项目名称，该文件就是用户直接访问的页面，我没有再新建其他文件，所有的界面都是内嵌在这个页面中完成。还有项目.css这个文件中，可以定义你的界面中各个控件想使用的显示属性，都可以使用css代码指定（上面说了CSS我是不会，我只是简单指定了一下绝对位置等）

 

第三，代码组织

形成一个清晰的代码组织结构对于项目开始很有用，让人一目了然，哪个包是负责什么的。

为了调试方便，我的客户端代码和服务端代码都是在一个工程中（通过设定项目依赖，可以分开在多个工程中），所有客户端描绘界面的代码都组织在*.*.web.client包中，与远程交互的代码在web.client.service中，该包中都是借口，还有其他的一些工具类都放在web.client.util中，注意这些类都只是在用户的浏览器中运行。

所有的实际的逻辑代码都在web.server中，针对每个service都有一个实现。

 

第四，需要注意的问题

前面已经陆续说到了

注意客户端只是在浏览器中运行的Javascript代码；

对于每个RPC调用都要编写web.xml中的servlet标签；

有些类不能在client端代码中使用；