Flex技术报告.doc

Flex + java + BlazeDS技术说明Flex + java + BlazeDS技术说明 北京金逸润丰信息技术有限责任公司2011年9月版本控制更新记录日期更新人版本备注2011-9-23李开永V1.0文档创建审核记录日期审核人职务备注2011-9-23李开永金逸润丰项目负责人发布记录拷贝数接受人职务备注目录1前言42Flex简介42.1Flex概述42.2从不同角度看Flex62.2.1技术角度62.2.2开发者角度62.2.3企业角度62.2.4用户角度72.2.5缺点与应对策略73BlazeDS简介83.1Messaging Services93.2Service adapter93.3Channels and endpoints93.4Channel types94Flex/BlazeDs选择理由104.1开源104.2完善的社区支持104.3带来广阔的就业前景104.4更高的业务效益回报104.5Flex是第一个专门为创建UI而设计的语言104.6编程风格近似于Java114.7BlazeDS可以在任何Java应用服务器上运行114.8可以在已有Java应用中运用114.9可以通过Java来扩展和修改BlazeDS114.10HTML和JSP也能调用BlazeDS124.11Flex和BlazeDS的数据传输性能远胜于其它Ajax解决方案124.12Java客户端能够直接调用BlazeDS124.13Spring下也能用134.14结论13Flex + java + BlazeDS技术说明1 前言传统Web应用的开发是基于B/S模式的，Web应用的表示层建立于HTML页面之上，而HTML只适合于文本，B/S模式的应用已经不能满足用户对更高的、全方位的用户体验（音频、视频等）的要求。C/S模式的应用又不能满足现代用户在数据共享、协同操作等方面的要求。在如今这个以用户为中心的时代，用户体验越来越重要，用户不仅要求应用要像C/S模式的应用那样具有良好的交互性，而且要求应用要像B/S模式的应用那样具有部署灵活和跨平台的优势。RIA技术便是在这种需求下应运而生的，它同时具备B/S模式和C/S模式应用的双重优势，很好地满足了现代用户的需求。对于企业应用而言，企业可以通过RIA技术继续使用现有的应用程序模型（包括J2EE和.NET），轻松构建更为直观、更易于使用、更迅速而且可以脱机使用的应用程序，无需大规模替换现有的Web应用。同时，RIA还可以帮助企业提供多元化的业务效益，包括提高产品销量、提高品牌忠诚度、延长用户在网站的停留时间、避免较频繁的重复访问、减少带宽成本、减少支持求助以及增强客户关系等。近年来，RIA一直是业界巨头竞相角逐的重点领域，因为业界一直流传着这样一句话：“拥抱RIA，拥抱软件开发的未来！”Adobe的Flex在RIA领域有先发优势，而且至今仍然是这个领域的领头羊和佼佼者。Flex出现以后，B/S企业应用在人机交互方面开始发生革命性变化。很多B/S系统开发者第一次接触Flex时就被它强大的UI渲染能力所震撼，使用Flex开发的B/S企业应用在人机交互方面的能力远远强于传统的C/S技术，很难想象在浏览器中也能够开发出如此酷炫的应用。使用Flex开发B/S应用的效率远远高于传统的JSP、ASP等技术，甚至高于Delphi、VB等传统的快速开发工具。这是因为Flex提供了更加简洁的组件开发机制，使我们能够快速构建新的组件，同时其强大的数据绑定功能也免去了编写大量赋值语句的工作。大家都知道，Java以开发稳定的、可跨平台的企业应用而著称。如果能够利用Flex开发易用性好、交互性强、外观炫丽的人机界面，使用Java开发稳定且可跨平台部署的业务逻辑，那将是多么美妙的一件事啊！令人振奋的是，Flex确实可以与Java完美地结合！快速开发出稳定的、易用的、用户体验良好的B/S应用将不再是梦想。如今，Flex+Java这一技术组合正在逐渐被业界所接受，在很多行业的大型企业应用（比如SAP、淘宝、中国移动等）中都能看到它们的身影。与很多Flex技术的忠实用户一样，我们坚信Flex+Java技术必定会成为开发企业应用的主流技术之一。我们的团队使用Flex+Java技术组合成功地开发了合众人寿投资管理系统系统一期和泰康资产划款指令系统与泰康资产基金申购单管理系统，并这三个企业上线运行，实实在在地感受到了这一组合的威力和给用户带来的震撼体验。2 Flex简介2.1 Flex概述Flex是排版打印软件和图形渲染软件巨头Adobe公司在其著名的Flash平台（Flash Player）上，用ActionScript语言开发的一套RIA软件开发套件（SDK）及其集成开发环境。Flex SDK由Flex框架类库、Flex编译器、调试器、MXML和ActionScript编程语言以及其他工具组成。Flash Builder则是其集成开发环境，Flash Builder构建在开源集成开发环境Eclipse之上，目前版本是Flash Builder 4。利用Flash Builder，开发者可以通过拖拽的方式开发人机界面，用ActionScript 3语言编写代码，调用Flash及Flex SDK所提供的API进行RIA开发，然后用FlashBuilder编译器进行编译，编译后的产品可以运行在Flash虚拟机中，同时Flash Builder集成了调试工具和性能查看工具，可以跟踪ActionScript代码的执行和观察内存变化。从开发出的产品层面来看，经过编译后的Flex应用和组件库是一系列可以运行在Flash虚拟机中的SWF文件。SWF文件由一系列有顺序的“帧”（Frame）构成，“帧”中包含编译后的ActionScript字节码以及所需的数据，比如图像、声音和视频。Flash Player按照“帧”的先后顺序，“试图”以固定的频率执行每一帧中的代码，以显示图形或者播放动画及语音。注意 在本书中，读者会经常看到Flash虚拟机和Flash Player这两个词，实际上Flash Palyer就是Flash虚拟机，ActionScript代码在Flash Player这个虚拟机中运行，以执行客户端逻辑、显示图形、播放动画、声音和视频。RIA简单的说，就是C/S+B/S的开发部署模式。C/S和B/S大家都很熟悉，C/S的优点在于借助局域网的信息安全和带宽优势，充分利用客户机器的运算能力从而降低服务器压力，缺点就是安装部署更新麻烦。那么在1998年，互联网风起云涌的时候，B/S逢时而生。B/S充分利用互联网的优势，解决C/S安装部署更新的一大难题。通过把业务逻辑处理放在服务器端，然后解析为HTML，利用HTTP协议传输到客户的浏览器上就万事大吉。看起来很美，其实干过就知道也很痛苦。哪儿痛呢，痛的当然是我们这些开发者。安装部署更新倒是省事儿了，装个IE，给个网址就能让客户登录了。但是，基于HTML+JavaScript的技术让人很崩溃。 B/S还有一些潜在的缺点。比如，客户端体验简单，不易开发丰富的效果来展示数据（这和当时的网络带宽也有关系）；必须联网才能运行，信息安全无法保障；应用程序需要通过其他技术辅助才能操作客户端资源；服务器负载过高而客户机运算能力未充分使用等。综合来讲，B/S仍然是一个不错的解决方案，它的Web应用程序和C/S的桌面应用程序曾一度二分天下，各领风骚数十年。从解耦角度来看，C/S以数据库的方式把数据从程序中分离，B/S以浏览器页面的方式把界面和逻辑再次分离，然而第二次分离是不彻底的。表面上只是代码结构的分离，从实质上看表现层仍然是逻辑层的附庸，前台UI完全和后台实现技术绑死（把已有项目后台从C#换成JAVA是不可能的。）为了解决这个问题，RIA出现基本实现了不依赖于特定后台技术，能与多种服务端搭配使用。在2002年，MacroMedia公司（简称MM，05年被Adobe收购）首先在Flash Player6中引入了RIA概念。2004年，MM正式发布Flex1.0，随着Ajax的火爆，RIA开始受到广泛关注。RIA主要有两个方面的含义，一是用户界面的丰富即富客户端，二是数据模型的智能，服务器已经变成了支持客户端正常运行的数据服务，并提供了异步数据传输和脱机缓存机制等复杂的数据处理能力。前面提到，RIA本质上就是C/S+B/S，它想集大成，想搞总结，想终结C/S和B/S二分天下的局面。说浅显点就是，如果以前的CS程序现在能在网络上运行，并且保持了原来的功能和特征，那么这就是一个RIA。回到当下，RIA各种技术一番拼杀，现在广为人知的只剩下四个：Ajax、Flex、SilverLight、JavaFx。AJAX,Flash,Silverlight,JavaFX到底选谁?事实上，像Adobes Flex, Microsofts Silverlight, 以及Sun 最近发布的JavaFX这样的计算技术，使得向量图形实质上优于AJAX提供的Dojo或者Yahoo图形实验室(YUI)这种构架.无论相信与否，在网络应用程序开发中，在基于网络的向量图形的应用方面存在巨大的商机，而这绝不仅仅是看起来比较诱人这么简单。需要注意到，无论是JavaFX, 还是Sliverlight现在都没有分享到被Adobe Flash Player占领的任何市场份额。在javaone2010大会上，oracle正式提出，废除javaFX Script，而使用java语言代替。在2011年上，将会推出预览版。显然，AJAX：编程犹如是做噩梦。Silverlight：微软，不开源。JavaFX：不成熟。Flex是我们的首选。 2.2 从不同角度看Flex2.2.1 技术角度（）具备了RIA时代富客户端的优点（C/S+B/S）；（）支持多种服务器语言（JAVA、.NET、PHP）及主流框架（Spring、Hibernate）；（）与Java结合后相当强大，能充分利用Java的资源背景；（）拥有丰富的组件和第三方组件，对企业级的数据汇总和业务流程展现力较强悍；（）借助开源的力量，拥有众多民间组织和牛人支持；（）Adobe公司（还有MM多年积累）的强大背景；（）源于Flash的天生丽质，轻松使用多媒体资源，动态交互性强；（）借助FlashPlayer的安装普及度，轻松实现跨浏览器跨平台；（）良好的架构设计和制作精良的文档示例，FLEX同步推出中文版；（）借助于插件丰富的Eclipse开发平台并拥有独立的IDE；（）框架设计重用性高，有利于模块化设计；（）近几年发展态势良好，获得了广泛认可，产品和技术也越发成熟。2.2.2 开发者角度（）开源，透明；（）基于Eclipse开发平台，易上手，且插件丰富；（）基于Eclipse平台，开发调试方便，FB4支持条件断点； （）ActionScript语言与Java的融合度和相似度较高，易学易用；（）MXML标签与XML相似，逻辑清晰可读性强；（）架构设计良好，耦合度低，有利于组件重用；（）无需针对不同浏览器编写代码，摆脱JS的编写和调试的噩梦； （）类似VB的可视化拖拽组件，快速创建界面；（）方便定制及使用第三方的皮肤和样式，无需美工也有好效果；（）支持多媒体资源，轻易开发动态交互性强的界面；（）众多的RPC组件保障对后台数据访问的安全性和效率；（）文档示例丰富，通过网络可以获取大量的学习资源；（）近些年发展态势良好，前景光明；2.2.3 企业角度（）开源，免费；（）具备了RIA时代富客户端的优点（C/S+B/S）；（）项目和组件的重用性高，易于资源积累和快速构建； （）Flex提供了与其他语言的结合，能广泛利用已有的资源；（）界面华丽，客户认可度高；（）学习曲线一般，培训成本低；2.2.4 用户角度（）部署和更新方便；（）界面漂亮，交互性强；（）安全； 2.2.5 缺点与应对策略 缺点（）继承了Flash的诸多优点，却唯独丢掉了Flash的小巧轻盈；（）目前尚没有比较好的减肥策略，带宽较好时这不是问题； （）对服务器和客户端的硬件设备都有一定要求； （）对一些较专业的领域涉及较少，需要第三方组件支持（比如地质方面的）；（）Adobe公司对中国分部的支持不够；接下来，会得到Adobe的支持。（）搜索引擎对swf文件的支持不够；（）与以往浏览习惯不同，比如右键被屏蔽，图片无法保存； 应对策略鉴于Flex生成的swf文件太肥是其主要缺点（加载慢，运行慢，内存占用多），我就主要从减肥和优化的角度来说一下使用心得。 （）Flex只是前台展现，需要搭配强大的后台（java）；（）考虑异步加载；（）界面推荐使用相对布局，合理组合，避免多余嵌套；（）界面加载图片使用外部加载方式，尽可能多使用矢量图形；（）规范CSS样式表，尤其注意使用的外部字体大小；（）使用额外的皮肤和特效时需要综合考虑生成的文件大小和执行效率；（）适当地考虑延时加载策略，主界面只显示必要的内容；（）规范编码，提高执行效率，避免内存泄露；（）使用Module和其他有效方式努力减肥；（）尽可能重写一些继承底层类的组件，执行效率更好； Flex内存泄露解决方法和内存释放优化原则 1、Flex内存释放优化原则（）被删除对象在外部的所有引用一定要被删除干净才能被系统当成垃圾回收处理掉；（）父对象内部的子对象被外部其他对象引用了，会导致此子对象不会被删除，子对象不（）会被删除又会导致了父对象不会被删除；（）.如果一个对象中引用了外部对象，当自己被删除或者不需要使用此引用对象时，一定要记得把此对象的引用设置为null;（）本对象删除不了的原因不一定是自己被引用了，也有可能是自己的孩子被外部引用了，孩子删不掉导致父亲也删不掉；（）.除了引用需要删除外，系统组件或者全局工具、管理类如果提供了卸载方法的就一定要调用删除内部对象，否则有可能会造成Flex内存泄露和性能损失；（）.父对象立刻被删除了不代表子对象就会被删除或立刻被删除，可能会在后期被系统自动删除或第二次移除操作时被删除；（）如果父对象remove了子对象后没有清除对子对象的引用，子对象一样是不能被删除的，父对象也不能被删除；（）注册的事件如果没有被移除不影响自定义的强行回收机制，但有可能会影响正常的回收机制，所以最好是做到注册的事件监听器都要记得移除干净。（）父对象被删除了不代表其余子对象都删除了，找到一种状态的泄露代码不等于其他状态就没有泄露了，要各模块各状态逐个进行测试分析，直到测试任何状态下都能删除整个对象为止。、Flex内存泄露举例：（）引用泄露：对子对象的引用，外部对本对象或子对象的引用都需要置null；（）系统类泄露：使用了系统类而忘记做删除操作了，如BindingUtils.bindSetter()，ChangeWatcher.watch()函数时候完毕后需要调用ChangeWatcher.unwatch()函数来清除引用，否则使用此函数的对象将不会被删除；类似的还有MUSIC，VIDEO，IMAGE，TIMER，EVENT，BINDING等。（）效果泄露：当对组件应用效果Effect的时候，当本对象本删除时需要把本对象和子对象上的Effect动画停止掉，然后把Effect的target对象置null;如果不停止掉动画直接把Effect置null将不能正常移除对象。（）SWF泄露：要完全删除一个SWF要调用它的unload()方法并且把对象置null;（）图片泄露：当Image对象使用完毕后要把source置null;(为测试)；（）声音、视频泄露:当不需要一个音乐或视频是需要停止音乐，删除对象，引用置null;、Flex内存泄露解决方法：（）在组件的REMOVED_FROM_STAGE事件回掉中做垃圾处理操作（移除所有对外引用（不管是VO还是组件的都需要删除），删除监听器，调用系统类的清除方法）先remove再置null,确保被remove或者removeAll后的对象在外部的引用全部释放干净;（）利用Flex的性能优化工具Profile来对项目进程进行监控，可知道历史创建过哪些对象，目前有哪些对象没有被删除，创建的数量，占用的内存比例和用量，创建过程等信息； 总结关键还是要做好清除工作，自己设置的引用自己要记得删除，自己用过的系统类要记得做好回收处理工作。以上问题解决的好的话不需要自定义强制回收器也有可能被系统正常的自动回收。3 BlazeDS简介BlazeDS是一个基于服务器的Java远程调用（remoting）和Web消息传递（messaging）技术，使得后台的Java应用程序和运行在浏览器上的Flex应用程序能够相互通信。 如果你想通过使用RPC Services提供一些企业级功能，如不同域之间数据交换的代理功能、客户端认证、服务器端日志、本地化支持、RPC Services服务集中化管理等功能时，BlazeDS通过使用RemoteObject控件可以轻松实现，而不需要配置他们像SOAP-compliant网络服务。 当客户端RPC控件调用远程服务时，该控件就会把服务端返回的数据保存在一个ActionScript对象中，这样，在程序中就能够很轻松的获取想要的数据，而这些客户端控件包括HTTPService、WebService、RemoteObject控件。 3.1 Messaging Services消息服务就是通过服务器端来回的传送消息以实现客户端的异步交流，一条消息由唯一标识号、BlazeDS头、其他自定义头和消息体组成。 客户端程序中发送消息的部分称为消息生产者（producers)，在Flex程序中可以通过Producer控件定义，而接收消息的部分称为消息消费者（consumer），在Flex中可以通过Consumer控件定义，Consumer控件负责订阅和接收服务器端某一个目的地的消息，而Producer控件负责向该目的地发送消息。 消息服务同时也支持通过JMSAdapter实现的桥接模式来访问外部的JMS服务器，这使得Flex程序能够与外部的Java应用程序实现数据交流。 3.2 Service adapterBlazeDS可以访问各种不同的数据持久化方案，比如数据库、JMS等其他持久化机制。The message-based framework（基于消息的框架）BlazeDS在客户端和服务器端来回的传送数据，他是一个基于消息的框架，主要运用了两种交换模式，第一种，请求/响应模式，客户端发送请求给服务端，服务端处理好之后返回一个包含结果的响应，RPC服务就是使用的这种模式；第二种，发布/订阅模式，服务端将数据发布给订阅了该消息的客户端列表，消息服务就是使用这种模式来发布数据给各客户端的，同时，消息服务也使用请求/响应模式来解决一些发布消息、数据交换等问题。 3.3 Channels and endpoints在网络上，客户端是通过通道与服务端传送数据的，通道负责封装消息格式、网络协议、解析方式、目的和应用代码，负责格式化和翻译消息为特定网络下的模式，然后分发给相应的端点。另外，通道使得客户端发送给服务端的消息变得有序性和对应性，这对数据传送的一致性和可预见性起到重要的作用。 在服务器端，通道是与基于Java的端点发生交换的，端点负责解析消息成特定的协议模式，然后把它传送给普通Java形式的“消息代理人”（Message Broker），最终由消息代理人决定该消息发往何处，路由给恰当的目的地， 3.4 Channel typesBlazeDS提供以下几种通道： （1）标准AMF通道； （2）加密AMF通道； （3）HTTP通道（AMFX）。 其中AMF和HTTP通道都支持无轮询的请求/响应模式和客户端轮询模式（模拟实时通信），而AMF和HTTP流通道模式提供了真正的数据流实时模式。 AMF（Action Message Format）是ActionScript对象序列化后的二进制流。用于Adobe Flash应用和远端服务的通讯。由于它是基于二进制的数据传输，所以相对于XML SOAP，json，WebService等基于字符串的数据格式，有数据体积小和效率高的特点。4 Flex/BlazeDs选择理由Flex结合BlazeDS是开发RIA的最佳组合之一。无论是高度交互的网站还是以Java为后端的企业应用，这项组合都是最佳选择之一。更重要的是，这项组合能同时为开发员和企业带来高回报（ROI）。 4.1 开源Flex软件开发工具箱（SDK）的核心是个开源框架，专门用来开发、维护那些在不同浏览器、不同操作系统下界面都相同的RIA应用。Flex发布采用的是Mozilla公共许可证（Mozilla Public License）。编译后的Flex应用在Adobe Flash平台下运行。BlazeDS是连接Flex和Java的索桥，是项针对远程调用和消息传递的开源技术。在Java应用服务器上，它以servlet的形式存在，因此可以在任何标准Java网络应用中运用它。BlazeDS以LGPL（Lesser GNU Public License）公共许可证书发布。在发布BlazeDS的同时，Adobe还公布了AMF（ActionScript Message Format）规格说明，BlazeDS、Java和Flex客户端间以这种简洁的二进制格式实现通信。4.2 完善的社区支持Flex社区非常活跃，社区贡献了大量项目。F，这个配以社区新闻的Adobe站点几乎每天都有新的社区贡献。 Google Code上的Flexlib项目，已经提交了大量的开源UI组件。Swiz和Mate项目贡献了优化事件处理的框架；还有Gorilla Logic贡献了自动化UI测试的Flex Monkeym项目。4.3 带来广阔的就业前景据Adobe的Flex“传道士”James Ward看来，Flex高级开发员的市场需求非常大， Flex能让你拥有极具市场竞争力的开发技能。 4.4 更高的业务效益回报总体上，开发企业web应用不是个轻松的活，这基本上是众所周知的事实。Flex和BlazeDS提供的不仅仅是功能强大的开发工具，而且开发技术本身相对也非常简单。开发效率可以得到大幅度的提升，产品因此可以很快推向市场。Flex和Flash带来的用户体验也相对更有魅力，对增加流量、提高用户转化率（conversion rate）很有帮助。 4.5 Flex是第一个专门为创建UI而设计的语言大部分语言都不是在第一时间设计其对UI的支持。Java中Swing包的实现刚好是个很好的证明。也就是这个原因，很多像捆绑数据这样的简单动作在Swing当中的实现就非常痛苦。用 Swing最大的问题在于，要想提高开发效率就必须要对其API了如指掌。Flex刚好相反，它是专门为创建web UI而设计的。正如Bruce Eckel所说，Flex是第一个针对UI开发的领域特定语言（DSL）。用Flex构建UI比其它诸如jsp、JSF、Swing等技术简便得多。语言本身糅合了数据绑定、事件处理、控件布局以及其它一些UI常用开发技巧，就算对语言没有深刻的理解也不会影响开发效率。4.6 编程风格近似于Java你可以继续使用现有的Java开发工具来开发Flex应用。当然也可以采用SDK中携带的免费命令行工具，Adobe Flex Builder（一个Eclipse插件），或最近的IntelliJ IDEA 8。Flex提供的是一个有状态环境，在这个环境中，数据从客户端加载。这种编程模式更像是开发桌面客户端而非HTML编程，这种风格对于用过Java Swing编程的开发员来说应该是相当熟悉。Flex是Mxml（类似XML的UI标记语言）和Adobe ActionScript（面向对象的解析语言）的结合体。鉴于这种结合方式，Flex编程与Java非常相似，因为两者用的都是熟知的面向对象的概念。最理想的开发环境是把Flex应用创建在web部署文件夹下。这样一来，每次更新应用之后都不需要重新部署，只要在浏览器下刷新一下就可以了。用Flex和BlazeDS开发后，开发效率绝对比之前有很大的提升。4.7 BlazeDS可以在任何Java应用服务器上运行BlazeDS目前已发布了多个版本，其中的turnkey版本还包含了为BlazeDS配置的Apache Tomcat。本文中，我用的是二进制发布版本，其中含有一个WAR用来展示如何把应用部署到各种应用服务器上去。不用这个WAR的话，你也可以从中提取 JAR文件放到自己的项目中去。关于安装BlazeDS的各种选项内容，可以参见BlazeDS的wiki。 4.8 可以在已有Java应用中运用假设想要扩展这个已开发好的服务，让其它Flex应用可以远程调用。 Flex返回的结果是通用的result变量，可以直接映射到Model。 4.9 可以通过Java来扩展和修改BlazeDS假如你想添加特殊的日志来记录苏打调配服务被调用的情况，那么你可以扩展标准的Java适配器来添加日志功能。首先，添加一个继承了JavaAdapter的Java类：import flex.messaging.services.remoting.adapters.JavaAdapter.public class TimingJavaAdapter extends JavaAdapter /其次，重载invoke()方法：public Object invoke(Message message) RemotingMessage remotingMessage = (RemotingMessage) message; String Operation = remotingMessage.getOperation(); String destination = remotingMessage.getDestination();Logg