传统的 Ajax 开发依旧是实现富 Internet 应用程序(RIA)的最主要方法。但是,Adobe® Flex 的流行度不容忽视。本文将介绍 Adobe Flex Ajax Bridge (FABridge),这是让您可以采用轻松而一致的方法集成 Ajax 与 Flex 内容的代码库。阅读完本文后,您将能够利用通过 Flash 资源获得的丰富功能。

  构建 Ajax 应用程序已被证明是提供优秀应用程序的一致方法。但是,Adobe Flex 的流行不容忽视。在不断努力实现最佳用户体验时,我们经常需要面对一项困难的任务:将嵌入到 Ajax 应用程序中的基于 Flash 的资源集成在一起。本文将讨论如何使用 FABridge 将 Flash 内容与现有 Ajax 内容集成在一起,FABridge 是由 Adobe 开发的代码库,用于处理这项特殊任务。
作为一名 Ajax 开发人员,现在是个特殊时刻。我们始终站在第一线,准备迎合用户并让他们对我们构建的应用程序留下最佳的第一印象。随着 Web 标准不断演进并且越来越多的供应商决定执行这些标准,我们的工作变得越来越轻松,使我们可以将精力集中在用户体验上。JavaScript 框架(例如 Ext JS、jQuery 和 Prototype)的进一步推进也使我们很少担心代码是否可以跨要求支持的平台工作,因此有更多时间进行创新。
  虽然现在我们可以使用的工具、技术和资源的确越来越多,但是推动 Flash 开发的开发方法也在发生变化。对于许多工作室,开发流程将涉及用户界面(UI)组,从而实现支持在服务器端生成的应用程序的设计。使用现在已有的 JavaScript 框架,我们正朝着客户端应用程序开发的方向发展。但是,Flex 平台 — 生成 Flash 应用程序的免费开源框架 — 的出现将我们进一步引入应用程序开发的竞技场。这类创新带给我们的好处在于客户端,但是必须确保充分、仔细地处理它与当前架构的集成。
 
集成问题:
 
  如果您期望用 Flex 资源替代所有 Ajax 内容,您的任务将更简单一些。但是,这是一种不太可能而且通常不切实际的方法,因为经常需要保留传统的 Ajax 功能。幸运的是,您完全可以利用两种环境的优点来生成丰富、集成的应用程序。
  将数据从 Flash 容器(HTML/JavaScript 代码)传递到 ActionScript 代码中有许多种简单方法,包括使用查询字符串和 <param> 标记。但是,这种方法仅限于将数据传递到容器中。一种功能更强大的技术是使用 ExternalInterface 类,这是一个应用程序编程接口(API),它用于代理 ActionScript 与 JavaScript 语言之间的通信。清单 1 中的示例最佳演示了 ExternalInterface 的使用:
 
清单 1. ExternalInterface 示例
 
                                
// ActionScript code
function exposed():String
{
     return "Hello, JavaScript!";
}

ExternalInterface.addCallback( "getActionScript", exposed );

// HTML/JavaScript code
< script language ="JavaScript" >

var result = flashObject.getActionScript();

</script>

< object id ="flashObject" ... >
     < embed name ="flashObject" ... />
</object>
    
 
  清单 1 演示了如何使用 ExternalInterface 类注册 ActionScript 函数,以便 JavaScript 代码可以调用该函数。您可以通过先定义 ActionScript 函数,然后使用 addCallback() 方法将该函数公开给要执行的 JavaScript 来完成操作。在 HTML 端,只需获得 Flash 容器的句柄并调用该函数,该函数是使用 addCallback() 方法的第一个参数命名的。虽然此演示主要是将函数公开给 JavaScript 代码,但是您可以使用另一种方式:使用 ExternalInterface 类的 call() 方法。
  ExternalInterface 类可以十分强大,但是实现该类有很大的缺点。要使用 ExternalInterface,必须可以编写代码以实现 ActionScript 和 JavaScript 环境。这不但要求额外的技巧,而且需要翻倍的工作量。在这种情况下,维护代码以及两个非常健壮的技能集可能会变得很困难。
  为了解决针对 Flash 外部 API 的开发限制,Adobe 发布了 FABridge。Flex SDK 附带的 FABridge 是用于公开 Flash 内容以编写浏览器脚本的小型库,并且它可以在大多数主要浏览器平台中工作。使用 FABridge,现在实质上不再需要直接实现 Flash 外部 API 所需的管道代码。此外,实现桥接所需的技能也不再健壮。作为一名 JavaScript 开发人员,您只需能够了解哪些 ActionScript 属性和方法可用。让我们从演示 FABridge 功能的一些示例开始。
 
 
  在开始使用 FABridge 之前,下面提供了可以使用的资料和开发环境。下载最新的 Flex SDK 后,请配置清单 2 中所示的目录结构:
 
                                
/
+--- bridge
|            +--- fabridge.js
|            +--- fabridge.as
|            
+--- index.html
 
  该目录结构非常简单:有一个索引页面和连接到 bridge 目录的 FABridge 脚本。FABridge 库文件的位置取决于您的环境。由于我使用的是 Mac OS X 中的 Flex Builder 3 Professional,因此我的库文件位于 install_root/sdks/frameworks/3.0.0/javascript/fabridge/ 中。