Dojo 作为一个强大的前端框架,能够让开发者很从容的应对这些挑战。本文将以 Dojo 作为工具,详细介绍面对不同的">业务需求,如何处理批量的 Ajax 请求。
在阅读本文之前,您需要具备以下知识:
Ajax 技术:Ajax 的英文全名是:Asynchronous JavaScript and XML,从名字可以看出 Ajax 是一种异步的与服务器业务交互的方式。通常,在浏览器内运行的 JavaScript 代码都是单线程的。Ajax 的异步交互方式使得前台的 JavaScript 程序不会阻塞在等待服务器响应的过程中。从而使前台程序能够一直保持激活和响应性。有关 Ajax 的内容请参考 Ajax 技术资源中心。 Dojo 框架:Dojo 是一个强大的前端框架,它提供了方便的 Ajax 方法、
丰富的小部件、数据结构、辅助函数、效果和布局帮助。有关 Dojo 的详细介绍请参考 Dojo 技术专题。 XMLHttpRequest 对象:这是一个 JavaScript 对象,用于向服务器发送请求和接收服务器的响应。详细介绍请参考相关资源。 异步编程模式:这种模式在 web 编程中变得越来越重要,通常用于执行时间可能较长的操作。异步编程模式不会等待
长时间的操作完成或是造成阻塞,
而是立即返回一个代表该操作的对象。操作成功或者失败之后会调用事先对该对象注册的回调函数。有关异步编程模式在 web 编程中的应用请参考相关资源。 并发和串行 Ajax 请求:顾名思义,并发 Ajax 请求是指客户端同时发送多个 Ajax 请求至
服务器端;串行 Ajax 请求是指客户端在一个 Ajax 请求返回之后再发送下一个 Ajax 请求。
Dojo 的应用将贯穿本文,选择 Dojo 的主要原因有以下两点:
Dojo 提供了专门用于异步编程模式的对象:dojo.Deferred。并且提供了很多进一步操作 Deferred 对象的机制和方法。通过这些机制和方法能够方便的管理多个 dojo.Deferred 对象。 Dojo 封装了一些静态函数(dojo.xhr 函数)使得开发人员能够很简单的触发 Ajax 请求。同时,dojo.xhr 函数返回一个 Deferred 对象用于进行异步编程操作。
基于上述内容,本文的主要内容可以归纳如下:
描述 dojo.xhr 函数的使用、如何将其应用于异步编程模式和如何利用异步编程模式实现小规模的批量 Ajax 请求管理 详细介绍用 dojo.DeferredList 和 dojox.lang.async.par 实现任意规模的并发 Ajax 请求 详细介绍用 dojox.lang.async.seq 实现任意规模的串行 Ajax 请求
准备工作
服务器端业务描述
由于本文主要讨论客户端实现 Ajax 请求。在此不介绍服务器端的实现方式,并且认为服务器已经实现了所有我们需要的功能,仅以最简单的方式描述服务器端的业务。
让我们用一个示例来说明,图 1 展示了服务器与客户端的交互。
图 1. 客户端与服务器端数据交互示
图 1. 客户端与服务器端数据交互示例
现在在服务器端有一个音乐管理系统,里面的音乐按照风格进行分类。服务器提供两类 REST 服务:
/music/{categoryOf
Music} 返回某一个分类的所有歌曲的概要信息 /music/{nameOfSong} 返回某一首歌曲的详细信息
客户端与服务器端的数据以 JSON 格式进行交互。
准备开发环境和调试工具
下载并安装 Firefox 浏览器,并安装 Firebug 插件。