在客户端保存状态

关键字: flex cairngorm

Keeping State on the Client

在第一部分里，我介绍了Cairngorm，一个简化大规模RIA开发中重复出现的复杂性的轻量级技术架构。

在这篇文章里，我描述了在开发企业RIA时面临的挑战 -- 特别是怎样在客户端保存状态。我在Cairngorm Store程序中解释了
这点。你将徐希Cairngorm架构里的两个基本模式:Value Object模式和Model Locator模式。在这篇文章结束时，你将了解
在你自己的Flex程序开发中使用这些模式。

介绍Cairngorm Store
Flex Store程序展示了Flex程序框架的特性。它展示了怎样使用多种layout containers、navigator containters、controls、
effects、data binding、Drag-and-Drop manager、form validation和History manager。
而且，Flex Store展示了Flex的组件开发模型和怎样创建与事件驱动架构集成的松耦合组件。学习Flex Store程序是熟悉使用
MXML和ActionScript开发声明式layout和业务逻辑的绝佳方式。

Cairngorm Store使用熟悉的Store程序并使用Cairngorm完全重新构建成为一个rapid，scalable和maintainable的企业RIA。

在第三部分我通过展示很容易就添加新功能性到Cairngorm程序来说明Cairngorm架构的好处。

Cairngorm Store:四个主要的挑战
我将解释怎样使用Cairngorm来解决RIA开发中常见的高级挑战。我也解释了Cairngorm框架里使用的多种设计模式。

一个好的技术架构首先将程序开发看作是商业问题的解决方案，然后作为一个实现该解决方案的系统，然后作为系统中自定义
软件的技术架构，最后作为该技术架构的详细的类级别的实现。

从高级来看，有四个主要的挑战Adobe consulting团队要面对:
1，在客户端保存状态
2，架构视图
3，推动FDD
4，调用服务端服务

这些挑战和需求对Cairngorm Store而言没有区别。

客户端展示要卖给客户的产品，购物车记住用户购买哪些产品，用户在结帐的流程中必须完成多页表单。在整个流程中，你的
程序必须在客户端维护状态。

单页面用户体验在页面中有许多不同的组件。有许多视图，如产品列表，图形显示，购物车，表单等等，你必须架构视图。

用户在程序中需要多个特性，用户必须能够做如下事情:
1，可以查看所有的产品以及对选择的产品可以浏览详细信息
2，添加产品到购物车或从购物车删除产品
3，购买购物车里的产品
4，继续完成结帐流程

这些特性驱动你的开发。

最后，程序出售的产品由于库存改变而更改。你的程序必须具有从服务端基础架构得到产品信息的能力。而且，当客户发送
订单时，你的程序必须将这些订单保存到数据库或SAP等系统。你的程序必须与服务端服务调用集成。

你可以看到，当学习这四个主要挑战时Cairngorm Store和其他RIA一样。

在这篇文章里，我们来看看第一个挑战:在客户端保存状态。

在客户端保存状态
你从Web程序开发移至RIA时首先要考虑的就是客户端是有状态的。

Web程序开发人员熟悉无状态请求/响应方式，因此，他们创建了多种方式来在客户端维护状态。你可以频繁的填充数据到
HTTP请求作为客户端而服务器更改页面，或者使用URL encoding或cookies来在客户端保存有限的状态信息，或使用这些
特性的抽象如J2EE sessions，保存在服务端，并让客户端可以访问。

但是，使用RIA，Web程序开发人员可以挣脱这些HTTP请求和响应的桎梏。你不需再构思无状态客户端的解决方案因为客户端
就是有状态的。如果你使用过Swing或AWT来构建桌面程序，你将耸耸肩因为这一切是如此熟悉。

MVC里State和Model的区别
许多开发人员熟悉程序开发里的MVC概念或Model/View/Control概念并想知道状态在这里的讨论中位于什么位置。非常简单，
状态就是模型。这展示了一些更常见的挑战来解决RIA里的模型的实现。

首先，我们抵制以字符串，数字，布尔值等所有primitive对象分散状态到你的程序中。这里使用面向对象开发最佳实践不是
我的目的。确实，接收OO原则的好处和实践是理解这篇文章的前提。

但是，我强烈推荐客户端保存数据 -- 作为状态，模型或任何称谓 -- 作为对象来具有语义含义。在这里语义是什么意思?
我的意思是如果你在线出售fly-fishing flies，你的对象模型应该包括flies，patterns，hooks和hackles。如果你出售
mortgages，你的对象模型应该包含products，rates，repayments和terms。如果你出售maps，你的对象模型可能包含routes，
waypoints，points of interest和gas stations。

同步客户端和服务端
RIA的有状态客户端的一个挑战是:客户端的状态通常反应了服务端的状态。让我们看看一些更多的设计问题。

在服务端程序开发中，一个首要挑战是状态通常位于两个层面:业务层和集成层。

集成层通常包含数据库，mainframes，message queues，ERP解决方案，CRM系统以及其他企业信息系统等在对象上保存数据
并处理业务逻辑的系统。

在企业程序开发里，这些系统以中间件层来集成进来并展示给用户，通常也称作业务层。许多解决方案企图跨两层来保存
状态。首先，在这些层里数据的表示非常不同。例如，关系数据库里的实体，关系，视图，查询必须被映射到中间业务层的
对象模型。你可以使用EJB，Hibernate，ADO.NET等技术来跨架构层映射数据。

作为RIA开发人员，你被从业务和集成层间的复杂里抽象处理，你主要关注于怎样确保业务层的模型与展示层数据一致。

你可以通过确保客户端和服务端的对象模型一致来减少最少的努力来保持对象模型同步。

介绍Value Object / DataTransfer Object 模式
当你呈现数据到客户端时，创建类或对象来表示数据是最好的了。例如，在Cairngorm Store里，产品就是我们需要展示的
东西。每个产品有一些属性:name，description，price，image和thumbnail iamge。

这些值对象在RIA里扮演这双重角色。除了在客户端保存状态外，它们也对程序的不同层交互数据非常有用。在服务端，考虑
你使用SQL查询数据库的策略...太罗嗦了，受不了了!

六，看看Cairngorm Store程序里的VO，在org/nevis/cairngorm/samples/store/vo包:

class org.nevis.cairngorm.samples.store.vo.ProductVO implements ValueObject, Comparable
{
   public static var registered:Boolean = Object.registerClass("org.nevis.cairngorm.samples.store.vo.ProductVO", ProductVO);

   public var id : Number;
   public var name : String;
   public var description : String;
   public var price : Number;
   public var image : String;
   public var thumbnail : String;
}

class org.nevis.cairngorm.samples.store.vo.ProductVO implements ValueObject, Comparable
{
  public static var registered:Boolean = Object.registerClass("org.nevis.cairngorm.samples.store.vo.ProductVO", ProductVO);

  public var id : Number;
  public var name : String;
  public var description : String;
  public var price : Number;
  public var image : String;
  public var thumbnail : String;
}

如果程序必须知道当前选择的product是什么，以ProductVO实例在客户端保存信息即可。如果程序需要在客户的购物车保存产品列表，以
ProductVO实例的列表信息保存即可。

而且，如果你需要从服务端传输products或传输products回到服务器，将数据作为对象传输即可。

在Flex和Java之间维持一个一致的对象模型
省略很多废话...

为了允许Flex映射客户端和服务端的value objects，你必须告诉Flex这些类之间的关系。在Cairngorm里，你通过如下方式即可:

public static var registered:Boolean = Ojbect.registerClass("org.nevis.cairngorm.samples.store.vo.ProductVO", ProductVO);

public static var registered:Boolean = Ojbect.registerClass("org.nevis.cairngorm.samples.store.vo.ProductVO", ProductVO);

这行代码确保客户端的ProductVO类映射到服务器上org.nevis.cairngorm.samples.store.vo包下的的ProductVO这个Java类

同XDoclet2使用ActionScript
XDoclet2是一个Java驱动的ActionScript代码生成器。

将模型和视图绑定在一起

进入Model Locator模式
Adobe Consulting团队构思了Model Locator模式作为FLex开发人员的最佳实践。

public static var selectedItem : ProductVo;

 public static var products : Array;

 public stativ var workflowState: Number;

<details:ProductDetails
   id="productDetailsCOmp"
   width="100%" height="325"
   currencyFormatter="{ModelLocator.currencyFormatter}"
   selectedItem="{ModelLocator.selectedItem}"
  addProduct=addProductToShoppingCart{event}"/>