现在的位置: 首页 > 综合 > 正文

Jaxcent AJAX 开发框架学习笔记

2013年10月02日 ⁄ 综合 ⁄ 共 4720字 ⁄ 字号 评论关闭

Jaxcent AJAX 开发框架学习笔记

 

—— 前天在网上无意中看到一个名为 Jaxcent 的 AJAX 开发框架,看过官方资料后觉得还有点儿意思,于是下回来试试,觉得确实有其存在的意义,在小规模的 Web/AJAX 应用开发中,尤其是有独立的设计人员和编程人员的小团队开发中,确实能起到提高生产力的作用。所以边学边把对此框架的理解记录下来备忘。

* 由于接触 Java 不久(实际上不到 3 周),文中对 Java 本身及相关工具的理解有限,难免有偏颇错漏之处,留待修正改进。

 

---------------------
 一、Jaxcent 能做什么
---------------------
  Jaxcent 旨在提供一个用于 AJAX 编程开发的,基于纯 Java 的框架及 API。

 

  “Jaxcent: Java-only AJAX programming. JavaScript programming not required!”

  正如其官方文档中说的:JavaScript 脚本编程不再是必需的了。


  需要注意的是,只有当你的 AJAX 应用的服务端打算用 Java 编写时,Jaxcent 才有用武之地。

 

---------------------
 二、Jaxcent 的特色
---------------------
1. 稳定良好的通用性

 

  1.1. 可以方便地部署于任何支持 Java Servlet 的容器或应用服务器内。
  1.2. 通过配置可工作于 IIS 或是 Apache Web Servers。
  1.3. Jaxcent 自行提供了一个简易的 Servlet 容器,可以实现独立的部署和运行。

2. 简洁明晰的编程模型

 

  通常情况下,开发 AJAX 应用时,程序员不得不编写客户端 JavaScript 脚本以实现基本的 B/S 通信、DOM 控制、状态维护及更新,以及其它一些繁复的工作。当使用 Jaxcent 框架进行 AJAX 开发时,一切都不一样了,客户端脚本简化到仅需一行:引入 Jaxcent 框架提供的一个 .js 文件,仅此而已。当然,如果您的应用中确实还需要自行编写更多的脚本以实现额外的功能,那与 Jaxcent 并不冲突。

 

  之后的开发工作重心,就完全转移到了服务端的 Java 程序中,几乎所有原本在客户端脚本里实现的具有 AJAX 风格的功能,现在都能在服务端施行。前台页面的设计者不必再时刻当心他们是否忘了给某个 BUTTON 添加点击事件,或是误删了程序员们写好的事件关联。而程序员也不需要在大片的 HTML 标记里寻找合适的添加事件的位置。

在服务端开发中,Jaxcent 也提供了方便的使用 session 及 application context 的方法,在必要的时候,各种需要维或同步状态的内容,也可自动记入 session 条目中。

3. 易于实施及应用到项目中


  如果要将 Jaxcent 应用到现有的或是正在开发中的项目,不需要花费太多精力。因为项目并不需要全部转换为 Jaxcent 框架,只需要新添加的页面或模块遵循 Jaxcent 规范即可。如果已有的部分希望转换为使用 Jaxcent 框架,要做的也仅是将部分代码改写到服务端 Java 程序中,客户端要做的,仅仅是删掉旧的 JavaScript 脚本,在将来可能发生的功能改变时,客户端的维护仅由艺术或设计人员即可独立完成。

 

----------------------
 三、Jaxcent 印象实例
----------------------
  我们以一个简单的 AJAX 应用为例,要实现的功能是通过 AJAX 技术,在客户端页面上定时同步显示服务器当前时间。

 

  用标准的 AJAX 方法实现此功能亦不复杂:

 

   1. 在页面里启动一个计时器.
   2. 创建 XMLHttpRequest 对象实例,设置回调函数.
   3. 计时器事件发生时,通过 XMLHttpRequest 实例向服务端发送请求.
   4. 在回调函数接收到服务端返回的时间数据后,更新页面上用于时间显示的 DOM 元素(假设是一个 ID="lab_CurTime" 的 <P> 标签)。

 

   按标准模型开发时,我们需要作的工作如下:

 

   1. 在设计好样式的页面中,编写以上 4 步涉及的 JS 脚本,或是将脚本写入单独的 .js 文件,在页面中引入。
   2. 编写运行在服务端的接口程序,根据实际情况不同,可以是 WebService, Servlet, JSP, ASP, PHP.......

 

   开发者需要考虑的细节如下:


   1. 确定客户端发送到服务端的请求命令的格式,比如设定为 ?action=getCurTime.
   2. 确定服务端发回客户端的数据格式,比如设定为表示当前服务器时间的简单字符串、JSON 串、XML 片段等。
   3. 如果项目是团队开发,那么这个格式一旦被确定,就需要同开发组成员沟通并明示,在其他可能使用此服务的模块中遵守此格式约定。
   4. 提醒客户端页面或 UI 设计人员,在可能发生的页面外观更改时,小心处理文件中插入的 JS 脚本代码。

 

   诚然,这个例子中的标准开发步骤,并没有复杂到必须考虑使用工具库甚至框架。

   但我们不妨看一下如果使用 Jaxcent 框架,会是什么样的情形。


   1. 设计人员像往常一样进行客户端页面设计
   2. 设计人员在页面中增加一个对 Jaxcent JS 桥接器的引用(典型的情况是在 HEAD 标记内添加:<script type="text/javascript" src="/jaxcent.js"></script>)
   3. 程序员编写服务端 Java 程序,主要内容如下:
      a. 类继承自 jaxcent.JaxcentPage.
      b. 声明一个 jaxcent.HtmlPara 变量 hp,并将其关联为 "lab_CurTime".
      c. 取得服务器当前时间 curTime.
      d. 调用 hp.setInnerHTML( curTime ).
      e. 创建一个线程,将 c, d 放到线程中定时执行.

 

   好了,至此,在我们的客户端页面上,那个重要的 <P> 标签就能不断地变化显示从服务器取回的时间文本了。

--------------------------
 四、Jaxcent 框架工作原理
--------------------------

  目前已经有许多正在被开发者们使用的 AJAX 工具库或是框架。两者的区别在于,工具库提供实现 AJAX 风格编程的基础函数集,而框架则在此之上,进而定制了一套 B/S 两端需要遵守的开发规范和编程模型。

 

  Jaxcent 框架的底层工作原理,与 ASP.NET AJAX Extensions 等框架类产品基本相同。通过 XMLHttpRequest 对象,在浏览器和服务器之间传递元数据和控制命令。

  基于目前 AJAX 框架标准并不统一的情况,Jaxcent 定位于提供一个轻量级的框架,当然轻量级更多是相对于主流 AJAX 框架产品而言,要掌握 Jaxcent 框架的使用,仍然需要付出少量的时间了解其结构。

 

  从上面的例子可以看到,一个基于 Jaxcent 框架的 AJAX 应用的基本结构及工作流程如下:

 

  客户端页面(JSP,HTML...) <--> JavaScript 桥接器 <--> 服务端 Jaxcent Servlet <--> 服务端 Java 程序(Class, Servlet, Beans)

  (其中 JavaScript 桥接器和服务端 Jaxcent Servlet 均包含在 Jaxcent 框架发行包内)

 

   通过对上述流程图的直观理解,和对 JS 桥接器代码的分析,可以总结出 Jaxcent 框架的实际工作过程如下:

 

   1. 在客户端页面引入的 JS 桥接器文件内,向 window 添加了一个 onload 侦听器事件(是添加而不是直接用 "=" 覆盖)。
    a. 当浏览器完成页面内元素的加载后,触发挂接的各 window.onload 事件.
    b. JS 桥接器在该事件中,向服务端 Jaxcent Servlet 发送初始请求,发送的数据中包含了当前页面的 URL.
    c. Servlet 通过查询配置文件(后述),查找与该页面关联的 Java 类,如果找到,则创建该类的一个实例.
    d. Servlet 返回重载了事件(如 OnClick 等)的元素特征(ID、TAG、TYPE 等).
    e. JS 桥接器查找特征对应的 DOM 元素节点,根据响应类型为其添加事件侦听器.
    * 至此 Jaxcent 对页面的初始化完成,页面进入 AJAX 意义上的执行期.

 

   2. 客户端向服务端的通信
    a. 当被添加了相关侦听器的 DOM 节点发生对应的事件时,JS 桥接器将状态变化记录并编码,发送到服务端 Servlet.
    d. Servlet 按上述方法将数据传递给对应 Java 类中对应事件的响应函数.

 

   3. 服务端向客户端的通信
    a. 与目前所有 AJAX 方法一样,JS 桥接器将定时向服务端 Servlet 发送状态查询,以及时发现服务端要回送的状态.
      (此过程可在服务端控制其改变刷新间隔时间、暂停、或继续)
    b. 当回送的状态指示有需要更新的 DOM 节点时,JS 桥接器查找目标节点,并做相应更新(外观、内容、状态).

 

   4. 页面关闭前,可执行可选的扫尾工作,如中止线程、销毁计时器等,以主动释放系统资源.

 

-------------------------
 五、Jaxcent 的 DOM 操作
-------------------------
  以目前版本的 Jaxcent 来看,框架中提供了几乎所有 DOM 标签对应的类,所有能在客户端通过 JS 脚本实现的 DOM 操作,几乎都能以 Java 类的方式实现在服务端。

 

  除了鼠标点击、移入、移出、键盘事件等常规事件外,框架中的类还封装了拖曳、调整大小这些扩展的功能。

  例如要实现将允许用户将一个表格内的某行拖到另一个表格中这样的功能,即使是非常熟悉 JS 脚本的开发者,要重头写出实现代码也会感到厌烦,除了要考虑拖动,还要考虑释放鼠标后旧元素的删除和新元素的插入。

 

  而在 Jaxcent 框架支持下,服务端程序中只需要不超过 10 行代码(关键代码仅 2 行)就能实现。对 DOM 繁琐细节的处理,都由相关类包办了。

 

 

------------------------
 六、Jaxcent 持久性支持
------------------------
  也许对于多数 AJAX 应用来说,数据库之外的持久性支持意义并不大,对用户体验的提升也十分有限。
  但如果某一个应用中,确实需要对客户端表面层进行通用的持久性支持,那 Jaxcent 基于 Java 的先天优势就显得有用了。可以试想一下,要将客户端所有状态记录在 Cookie 或是数据库里,组织这些数据实际上会令人颇伤脑筋(当然 Jaxcent 也提供了访问 Cookie 的方法,如果确实需要用的话),这时候想想序列化三个字,应用会感到轻松不少。

 

 

--------------------------
 七、Jaxcent 的部署和配置
--------------------------
...还没写
----------------------
 八、Jaxcent 的类结构
----------------------
...还没写
--------------------------
 九、Jaxcent 综合应用实例
--------------------------
...还没写

 

---------------------
 十、Jaxcent 官方网站
---------------------

http://www.jaxcent.com/


 

抱歉!评论已关闭.