Chinaunix首页 | 论坛 | 博客
  • 博客访问: 199333
  • 博文数量: 163
  • 博客积分: 4010
  • 博客等级: 上校
  • 技术积分: 1720
  • 用 户 组: 普通用户
  • 注册时间: 2009-06-08 11:41
文章分类

全部博文(163)

文章存档

2011年(1)

2009年(162)

我的朋友

分类: Java

2009-07-10 15:17:11

这篇文章的前三部分展示了Flex组件如何实现逐步增强一个Web应用:开源SWFObjec 库使得嵌入Flash Player变的简化——一个Flex应用的实施环境——到HTML内。Flash Player,依次允许委派与用户界面相关的逻辑到Flex组件内。Flex指定的用户界面语言不仅仅使得用户界面代码更简单,而且使得你的应用程序从 Flash Player的实时编译、用户界面结果、多种手段支持等等中获益匪浅。另外,因为Flex支持以CSS为基础的样式,你的Flex组件将会与外界环境 HTML页面相处得十分和谐。 

  一个关键方面在于逐步增强的Flex能够通过数据传输到达Flex组件中。在前面我们曾经提到,服务器产生的JSON阵列反映了应用程序的数据,然后它作为FlashVar传递到Flex组件内。

  尽管FlashVar允许Flex成为现有的企业级应用的一部分,并且对应用程序的改变很小,FlashVar仍然有一个非常大的限制:因为 FlashVar是由名称/值组成的字符串,在浏览器上面对于字符串对象的最大长度有限制。对于大多数浏览器而言,这个限制是65KB。

  两个阶段载入

  你可以去掉这个限制,这需要你为Flex组件执行它自己的数据载入作准备。这就需要两个阶段载入的网页:

  对浏览器的要求做出响应,第一个阶段载入HTML页面和嵌入的SWF(Flex)对象;

  一旦Flex应用完全展现在浏览器上,Flex获取应用程序的数据用来填充到组件中。

  第二阶段载入很多丰富客户端应用程序的一般协议,通过减少响应时间可以改善用户体验:只要用户定留在同一个HTML页面上,阶段一的执行就只进 行一次。所有之后的数据存取的发生都是通过第二阶段实现的,缓解了每一次浏览器检索以及重新展示用户界面的时候对于服务器的要求。性能优势得益于这种模式 充分利用了每个应用一个页面的模式,比如说谷歌的Gmail和地图应用程序。

  这篇文章的其余部分将会说明Flex对于来自远程网络资源的数据载入最优化的三种方法:通过HTTP载入JSON数据,通过HTTP载入 XML,以及通过高性能的串行协议直接引用服务器Java对象。对于RESTful 数据存取而言,前两种方法是一个好的选择,尽管远程对象引用适合RPC通信样式。最新方法的一个优势是客户端以及服务器可以通过类型对象通信。

  JSON 超越 HTTP

  Flex的HTTP Service类使得委托JSON数据载入到Flex客户端的过程变得简单。下面的ActionScript代码获得了指定的URL的内容,作为Flex客户端完成事件处理程序的一部分。

  

      ...

  private function onCreationComplete():void {

  var http:HTTPService = new HTTPService();

  http.url = "booksInventory.json";

  http.addEventListener(ResultEvent.RESULT, onResult);

  http.addEventListener(FaultEvent.FAULT, onFault);

  http.send();

  }

  private function onResult(event:ResultEvent):void {

  booksInventory.dataProvider = JSON.decode(event.result as String) as Array;

  }

  private function onFault(event:FaultEvent):void {

  Alert.show("Can't load data: " + event.message);

  }

  ...

列表一:使用HTTPService获取JSON数据

  HTTPService,Flex SDK的一部分,为Ajax XMLHttpRequest对象提供相似的功能:给予一个URL,它使得你能够从HTTP数据源异步的获取数据。send()会立即调用返回。当结果返 回的时候,或者采用另一个选择,就是将错误删除的时候,回调机制采用这项功能

  这个实例的结果以及失败处理程序功能都是由名称引用的:编译程序将会找到与方法相匹配的名称以及必须的参数和返回类型,然后分配这些功能,作为操作者来处理这些结果或者失败的HTTP请求。

  实例的结果和失败处理功能每一个都是由一个单一行组成的,你可以使用ActionScript功能让这些代码变的简练一些:

  

      private function onCreationComplete():void {

  var http:HTTPService = new HTTPService();

  http.url = "booksInventory";

  http.addEventListener(ResultEvent.RESULT,

  function(event:ResultEvent):void {

  booksInventory.dataProvider =

  JSON.decode(event.result as String) as Array;

  });

  http.addEventListener(FaultEvent.FAULT,

  function(event:FaultEvent):void {

  Alert.show("Can't load data: " + event.message);

  });

  http.send();

  }

  列表二:功能的成功和失败处理

  ResultEvent的结果特性是非类型对象,并且我们必须在其转变为JSON阵列之前将它转变为字符串。因为这种转变确认了数据或者转变为指定的数据类型,或者返回空值。在这个例子当中,错误的处理程序仅仅是显示了一些不友好的模块,标示出了通信错误的原因。

  伴随着这种改变,我们现在可以从Flex组件的外界环境HTML页面中去掉FlashVar。因为Flex组件执行它自己的数据载入,客户端可以载入的数据总量是仅由可用的记忆存量限制的。

阅读(1549) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~