AJAX技术在远程教育系统中的应用

摘要：针对采用请求/响应交互模式的远程教育平台不能实现异步通讯的问题，分析了Ajax技术的原理及其关键技术，并采用Ajax技术设计和实现了一个远程教育系统，实验表明，基于Ajax技术的应用提高了交互式教学的响应速度。

关健词：Web2.0；Ajax；远程教育

中图分类号：G642 文献标识码：A 文章编号：1009-3044（2013）12-2829-03

远程教育是一种基于计算机技术和通讯技术的新教育方式，随着计算机网络技术的飞速发展，它凭借其自身优点，已成为现代教育的一个亮点。在现有的高等教育条件下，采用网上现代远程教育形式， 扩大了高校教学覆盖面。目前，基于Web 技术以B/S架构为基础的应用日渐成熟，但是传统的Web 应用有着诸多不足，如性能较低、网络流量较大，等待时间较长，与学生的交互过程不够快捷等等。为了克服传统Web 应用技术的缺点，该文引入作为Web2.0 核心技术之一的Ajax 技术，基于Ajax技术构建一个应用于远程教育的培训系统，实现了应用页面与服务器的异步通讯，浏览器窗口无需刷新即可满足学习者的操作需求，使页面重载次数和学习者等待时间大大减少，相比于传统WEB应用技术，Ajax技术不仅在具有动态性、交互性有着明显的优势，且还具有人机界面更为友好的特点。

1 Ajax简介

1.1 Ajax的工作原理

Ajax（Asynchronous JavaScript and XML）是多种技术的综合， 包括JavaScript， XMLHTTP， XML， HTML 和CSS， DOM， XSLT。Ajax技术克服了以往网络交互过程中的长时间进行循环 “处理—等待”的缺点，用户的WEB应用在执行任务的过程已加载了Ajax 引擎，该引擎的主要作用是负责解释执行用户界面及其与服务器之间的交互，允许Web 页面在无需刷新整个页面的情形下和服务器主机进行通信，使学习者与页面之间的交互过程异步执行，独立于用户和网络服务器间的交流。Ajax技术根据实际需要获取数据，使数据的实际读取量大大降低。

Ajax的工作原理可以理解为在学习者和服务器之间架设一个中间层， 使用异步方式实现学习者的操作和服务器响应，无须学习者的所有请求都提交给服务器， 譬如一些数据处理和数据验证等都交给Ajax引擎来完成， 只有当从服务器获取新数据这一需求得到确定时，再由Ajax引擎向服务器提交获取数据的请求。

传统的WEB开发是以一种基于静态页面的方式来理解WEB应用的。从Ajax的角度来看，Web应用只是由少量的页面构建， 而每个页面则是一个次级别的Ajax应用。每个页面都包括有一些基于JavaScript开发的Ajax组件。这些组件使用Http Request对象和XML以异步的方式与服务器通信， 在这些组件从服务器获取所需数据后使用DOM API来实现页面中的部分内容的更新。因此Ajax技术与传统的WEB应用技术的区别主要体现在以下3个地方：

1）无须刷新整个页面， 在页面内实现其与服务器通信。

2）实现学习者的操作与服务器响应异步化， 无须打断学习者的操作，具有更加迅速快捷的响应速度。

3）由Ajax技术构建的WEB应用仅由少数页面组成，大部分交互在页面之内即可完成， 无须频繁切换整个页面。

综上所述，采用Ajax技术使得Web应用动态化更好，智能化程度更高， 并且提供了具有更丰富表现能力的Ajax UI组件。

1.2 Ajax的关键技术

1）XML Http Request对象

Ajax 的一个最显著的特点是不需要刷新页面即可向服务器传输或读写数据， 这一特点主要是通过XML Http Request对象和XML Http组件来具体实现的。XML HttpRequest对象在众多浏览器上已经实现并且拥有一个简单的接口来允许数据从客户端到服务端之间的传递，且这一传递过程并不会影响学习者的当前操作。XML HttpRequest从名称上看只能传递XML格式的数据，实际上采用XML HttpRequest传送的数据可以是任何格式。

2）JavaScript

JavaScript是一种基于对象以及事件驱动的客户端脚本语言，具有相对安全性。同时它也是一种广泛用于客户端Web开发的脚本语言，常用来给HTML网页添加动态功能，比如响应用户的各种操作。在Ajax中JavaScript是XML Http Request和DOM交互的纽带。JavaScript首先通过调用 XML Http Request的属性和方法从服务端获取数据，然后再通过调用DOM 的API来实现WEB页面的内容的更新。

3）DOM （Document object model）

文件对象模型DOM是给XML和 HTMP文件使用的一组API。它提供了文件的结构描述，可以使页面动态的变化，如可以改变页面的内容及可见物。其实质是连接网页与脚本或程序语言沟通的纽带。 WEB开发人员操作及建立文件的属性、方法以及事件都通过对象来展现，这些对象可以由现行市场绝大多数的浏览器通过脚本来取用。

4）XML

XML是一种可扩展的、开放的、可自描述的语言结构， 它现已发展成为网上文档和数据传输的标准。XML更加容易的定义某些结构化数据， 还可以通过他和其他应用程序实现数据的交换。

2 系统的总体框架

本文采用Ajax（Asynchronous JavaScript and XML）设计远程教育系统，实现了浏览器与服务器之间的异步通信，从而在不刷新浏览器窗口条件下满足了用户的操作，页面重载次数和用户等待时间大为减少。系统采用时下常用的浏览器/服务器模式的网络设计方案，整体基于J2EE架构，在网络服务器端采用的Web应用框架是基于Ajax技术的DWR（Direct Web Remoting）与Struts结合，应用MVC（Model-View-Control）设计模式，使系统统结构明晰、具有很强的兼容性、可扩展性、灵活性以及可操作性和可维护性。

根据具体功能可以将远程教育系统分为以下几个模块：系统管理、资源管理和用户交流。其中，系统管理模块实现系统管理员完成登录用户信息管理、教育资源整理等功能；而资源管理模块完成上传和下载、浏览与检索资源功能；用户交流模块完成学习用户即时咨询或者在线留言、以及教师在线答疑功能。

2.1 数据持久层

远程教育系统应用Hibernate进行数据持久层的开发，通过插件集合Myeclipse提供的Hibernate反向工程，为Mysql中的数据表自动生成相应的POJO类、DAO接口和映射文件。如针对分类表category生成category类存储资源的分类信息，针对资源表source生成source类存储资源的详细信息

2.2 Action的管理

该系统采用Struts2.0进行实际业务流程操作。对于资源管理部分，首先通过继承DispatehAction创建相应的Action类SourceAction，完成一组相关的业务操作。在Action中创建一些诸如添加操作、获取数据列表信息等实现实际业务操作的方法。最后ActionServlet会根据配置文件中Action的参数配置来进行相对应的业务操作。

2.3 利用Ajax改进用户体验

当有新用户需在系统中注册时，采用Ajax页面无刷新技术。在客户端，在用户名输入框失去焦点时，用户所填信息已发送至服务器端，并判断用户名已存在与否，若已存在，则弹出如图所示对话框，通过XML HttpRequest发送请求页面，服务器将结果文本写入页面。

3 结束语

Ajax在远程教育支持系统的构建中有诸多实用的优点，运用Ajax 可以使程序对用户的响应更加灵敏， 从而加强与用户的交互性，降低带宽要求， 提高操作处理效率，增加准确性和智能性， 为用户提供更好的教育服务。

Internet 为远程教育的发展提供了技术支持，但要把这种技术支持融合到教育过程中，还需要广大教师和电教人员的共同努力。发挥Internet 的技术优势，克服其在教育支持上的弱点，实现智能优化网络教育，使Internet 网络教学向更深更远发展。

参考文献：

[1] 肖国强.基于Internet 的远程教育教学设计模型[J].电化教育研究，2001，（4） .

[2] 龚志武. 基于Internet 的远程教育传播模式的特征及优化[J].电化教育研究，2001，（4）.

[3] Rohit Khare. Beyond AJAX： Acceleratlng Web Applicationswith Real Time Event Notification. August 2005.