Welcome

首页 / 脚本样式 / Dojo Toolkit / 使用Flex和Dojo开发交互式Web应用程序

使用Flex和Dojo开发交互式Web应用程序2011-08-17 IBM 郭淼 侯轶简介:本文分为四个部分,首先简单介绍交互式 Web 应用程序的体系结构,分析 Dojo 技术和 Flex 技术的用途;然后通过一个具体实例来讲述 Flex 应用程序的开发及与传统 Web 项目的结合;其次同样 通过实例介绍如何在 Web 客户端中使用 Dojo 技术,及如何和后台服务进行交互,最后分析 Flex 技术 和 Dojo 技术结合使用这种模式在交互式 Web 应用程序中的可行性和所具有的优势。通过本文的讲解, 一方面读者能够清楚的了解到同时使用 Flex 和 Dojo 的必要性、可行性及相对应的应用场景;另一方面 ,相信读者能按照实例所介绍的步骤及一些经验技巧,快速将 Flex 和 Dojo 技术运用到原有传统的 Web 应用程序中去。

引言

以用户体验为核心的交互式 Web 应用程序在行业解决方案中是必不可少的一部分,新兴的 Ajax 技术 和 Flex 技术都能使开发人员更便捷地创建出色的富 Internet 应用程序(RIA)。Dojo 作为 Ajax 技术 的代表,是目前最为强大的 JS 框架之一,它提供了极其完备的可调用库,而且受到 IBM 的支持并在 IBM 产品中广泛使用;Flex 则是通过为开发人员提供面向对象编程的方式来描述应用的外观和行为。

Flex 和 Dojo 介绍

Flex 通过为开发人员提供面向对象编程方式,借助相比 HTML 更加规范化、标准化的 MXML 语言来描 述应用的外观和行为,最后由 MXML 与 ActionScript 编译生成 swf 文件融合到 Web 客户端里面。正因 为 Flex 偏向于开发人员,而且包含了丰富的组件库,所以更容易让开发人员创建出色的富 Internet 应 用程序。下面简单介绍一下 Flex 中的两个关键技术:

MXML 是一种基于 XML 的用户界面标记语言,主要用于对 Flex 应用程序进行布局并向其添加组件, MXML 还用于对服务器端数据源的访问以及用户界面组件和数据源之间的数据绑定。它允许开发人员创建 动画、状态、转换和样式,并且具有很好的可扩展性,允许开发人员方便地创建可重用组件。

ActionScript 是基于 ECMAScript 的脚本编制语言,在 Flex 中,ActionScript 允许您为应用程序 增添交互性。

Dojo 是一个面向对象,开源的 JavaScript 工具箱。它为开发 Web 富客户端程序提供了一套完整的 Widget 和一些特效操作。

根据 Flex 和 Dojo 各自的特性和优势,为了更好的满足用户的需求,提供良好的用户体验,本文讲 述的交互式 Web 应用程序将采用以下策略,其中针对交互性更强的图片处理部分将通过 Flex 实现,而 对实时性要求更高的图片、文本信息更新和交互部分则通过 Dojo 来实现。

应用程序模型及交互模式

在传统的三层体系结构中,可以看到无论是业务逻辑层产生变化,还是对数据库进行改变都不会对这 两者中的另一层产生影响或者只产生很细微的影响,可以说数据库和编程语言基本上完成了解耦;但是进 一步思考,会清晰的发现这样一个问题,当外界需要系统对业务逻辑层进行的升级或改变时,会直接导致 现有的表现层几乎彻底的改变,这一问题在传统的三层体系结构下无法避免。

RIA 的出现可以在很大程度上改变这一缺陷。这是因为一方面在 RIA 应用程序模型中,可以将业务功 能进行封装,并以服务的方式提供给客户端,客户端不管是 JavaScript,Dojo 或者是 Flex 都不需要关 注功能的实现,而只是去专注于用户的交互体验;另一方面,RIA 应用程序的客户端仅由浏览器和插件构 成,用户界面高度的统一,应用的升级、改变对用户几乎毫无影响,用户无需对客户端进行升级、扩展等 操作。本文将沿用现有 RIA 应用程序的模型,如下所示:

图 1. 应用程序模型

为了达到表现层和服务器端动态交互的目的,这里所采用的方式是:由 Flex Builder 编译生成的 SWF 文件可以通过 AMF 协议方式或 XML 方式为 FlashPlayer 与服务器端提供一种高性能的访问方式; 而 Dojo 则是通过 JSON-RPC 来异步调用服务器端 Java 对象。具体的实现方式会在接下来的实例中具体 阐述。