FLEX與EOS集成開(kāi)發(fā)培訓(xùn)手冊(cè)(共39張)

FLEX、EOS開(kāi)發(fā)培訓(xùn)目錄本次培訓(xùn)的目標(biāo)EOS體驗(yàn)開(kāi)發(fā)EOS的進(jìn)階開(kāi)發(fā)EOS、Flex集成開(kāi)發(fā)本次培訓(xùn)的目標(biāo)如何EOS用開(kāi)發(fā)SOA應(yīng)用明確如何使用Flex開(kāi)發(fā)web界面了解EOS如何與Flex集成開(kāi)發(fā)目錄本次培訓(xùn)的目標(biāo)EOS體驗(yàn)開(kāi)發(fā)EOS的進(jìn)階開(kāi)發(fā)EOS、Flex集成開(kāi)發(fā)EOS體驗(yàn)開(kāi)發(fā)-HelloWorldEOS體驗(yàn)開(kāi)發(fā)-項(xiàng)目創(chuàng)建6EOS體驗(yàn)開(kāi)發(fā)-構(gòu)件包設(shè)計(jì)7EOS體驗(yàn)開(kāi)發(fā)-頁(yè)面流開(kāi)發(fā)8EOS體驗(yàn)開(kāi)發(fā)-頁(yè)面開(kāi)發(fā)9EOS體驗(yàn)開(kāi)發(fā)-邏輯流開(kāi)發(fā)10EOS體驗(yàn)開(kāi)發(fā)-完善頁(yè)面流和頁(yè)面11EOS體驗(yàn)開(kāi)發(fā)-測(cè)試運(yùn)行12EOS體驗(yàn)開(kāi)發(fā)-測(cè)試運(yùn)行13Flex體驗(yàn)開(kāi)發(fā)-HelloWorld目錄本次培訓(xùn)的目標(biāo)EOS體驗(yàn)開(kāi)發(fā)EOS的進(jìn)階開(kāi)發(fā)EOS、Flex集成開(kāi)發(fā)EOS的進(jìn)階開(kāi)發(fā)-表單查詢開(kāi)發(fā)表單查詢開(kāi)發(fā)-數(shù)據(jù)準(zhǔn)備腳本參見(jiàn)備注表單查詢開(kāi)發(fā)-構(gòu)件包設(shè)計(jì)表單查詢開(kāi)發(fā)-數(shù)據(jù)建模表單查詢開(kāi)發(fā)-頁(yè)面流開(kāi)發(fā)表單查詢開(kāi)發(fā)-頁(yè)面開(kāi)發(fā)表單查詢開(kāi)發(fā)-邏輯流開(kāi)發(fā)表單查詢開(kāi)發(fā)-完善頁(yè)面流開(kāi)發(fā)表單查詢開(kāi)發(fā)-完善頁(yè)面開(kāi)發(fā)表單查詢開(kāi)發(fā)-測(cè)試運(yùn)行目錄本次培訓(xùn)的目標(biāo)EOS體驗(yàn)開(kāi)發(fā)EOS的進(jìn)階開(kāi)發(fā)EOS、Flex集成開(kāi)發(fā)FLEX集成開(kāi)發(fā)案例描述本例以之前做的EOSTripping項(xiàng)目為基礎(chǔ)，將之前jsp頁(yè)面換為flex的開(kāi)發(fā)界面，通過(guò)flex來(lái)調(diào)用邏輯流實(shí)現(xiàn)數(shù)據(jù)交互查詢功能詳細(xì)的開(kāi)發(fā)步驟如下1.配置EOS環(huán)境2.新建Flex項(xiàng)目3.配置Flex環(huán)節(jié)4.HelloWorld開(kāi)發(fā)5.員工查詢開(kāi)發(fā)6.練習(xí)FLEX集成開(kāi)發(fā)-EOS環(huán)境配置1.打開(kāi)EOSTripping項(xiàng)目，部署B(yǎng)lazeDs在相關(guān)配置，將BlazeDs的jar包復(fù)制到項(xiàng)目的lib文件夾下，配置文件放到WEB-INF下的lfex文件夾下，如下圖：BlazeDS：它是基于服務(wù)器的java遠(yuǎn)程調(diào)用（Remote）和web消息（Message）的通訊技術(shù)，使得運(yùn)行在后臺(tái)的java應(yīng)用程序和運(yùn)行在前端的flex應(yīng)用程序間能夠相互互相通訊。BlazeDS包含的.jar包為及配置為件：flex-messaging-common.jar、flex-messaging-core.jar、flex-messaging-opt.jar、flex-messaging-proxy.jar、flex-messaging-remoting.jar配置文件為：messaging-config.xml、proxy-config.xml、remoting-config.xml、services-config.xmlFLEX集成開(kāi)發(fā)-EOS環(huán)境配置2.修改remoting-config.xml，配置遠(yuǎn)程調(diào)用邏輯：注意：default-channels節(jié)點(diǎn)配置了flex調(diào)用后臺(tái)的時(shí)的協(xié)議通道，其中my-amf對(duì)應(yīng)services-config.xml配置文件中節(jié)點(diǎn)channel-definition的id屬性值（channel-definition對(duì)應(yīng)的amf通道一般有my-amf、my-secure-amf、my-polling-amf），當(dāng)以https的方式訪問(wèn)時(shí)，一般會(huì)將ref的值配置位‘my-secure-amf’，推送模式時(shí)一般配置為my-polling-amf。destination節(jié)點(diǎn)配置了flex與java通訊時(shí)調(diào)用的具體java實(shí)現(xiàn)類，F(xiàn)lexInvoker.java提供了一個(gè)invoke方法，在后面會(huì)講到。<?xmlversion="1.0"encoding="UTF-8"?><serviceid="remoting-service"class="flex.messaging.services.RemotingService"><adapters><adapter-definitionid="java-object"class="flex.messaging.services.remoting.adapters.JavaAdapter"default="true"/></adapters><default-channels><channelref="my-amf"/></default-channels>

<!--調(diào)用邏輯流--><destinationid="flexObject"><properties><source>com.eos.access.client.FlexInvoker</source><scope>application</scope></properties></destination></service>FLEX集成開(kāi)發(fā)-EOS環(huán)境配置3.修改web.xml，配置flex監(jiān)聽(tīng)器及servlet，增加如下內(nèi)容：注意：services.configuration.file對(duì)應(yīng)在/WEB-INF/flex/services-config.xml路徑，它為services-config.xml所在項(xiàng)目中WEB-INF中路徑，不要寫錯(cuò)。<!--EOS6withflex--><listener> <listener-class>flex.messaging.HttpFlexSession</listener-class></listener><!--thisisconfigureforEOS6withflex--><!--MessageBrokerServlet--><servlet> <servlet-name>MessageBrokerServlet</servlet-name> <display-name>MessageBrokerServlet</display-name> <servlet-class>flex.messaging.MessageBrokerServlet</servlet-class> <init-param> <param-name>services.configuration.file</param-name> <param-value>/WEB-INF/flex/services-config.xml</param-value> </init-param> <load-on-startup>1</load-on-startup></servlet> <servlet-mapping> <servlet-name>MessageBrokerServlet</servlet-name> <url-pattern>/messagebroker/*</url-pattern></servlet-mapping>FLEX集成開(kāi)發(fā)-配置FLEX項(xiàng)目FLEX集成開(kāi)發(fā)-helloworld開(kāi)發(fā)HelloWord程序-界面開(kāi)發(fā)HelloWord程序-界面開(kāi)發(fā)2.修改clickHandler方法：<mx:Script><![CDATA[importmx.rpc.events.ResultEvent;importmx.rpc.remoting.mxml.RemoteObject;privatevarbizx:String="“;privatefunctionclickHandler(event:MouseEvent):void{varremoteObject:RemoteObject=newRemoteObject();remoteObject.destination="flexObject“;//invoke方法的參數(shù)varuser:Object={userId:"",userName:""};varsession:Object=newObject();session.userObject=user;//bizx邏輯流的參數(shù)argsvarargs:Array=newArray();var_text:String=id_input.text==“”?"null":id_input.text;//如果為空，賦為默認(rèn)值args.push(_text);//調(diào)用后臺(tái)邏輯remoteObject.invoke(session,bizx,args);//成功后調(diào)用邏輯remoteObject.addEventListener(ResultEvent.RESULT,function(event:ResultEvent):void{varresults:Array=ArrayUtil.toArray(event.result.data);if(results.length>0){id_return.text=results[0];}});}]]></mx:Script>tip:1.remoteObject.destination值為flexObject，對(duì)應(yīng)remoting-config.xml文件中destination的id屬性值2.invoke為之前配置FlexInvoker.java類提供的方法，第一個(gè)參數(shù)為session對(duì)象，第二個(gè)為需要調(diào)用的邏輯流，第三個(gè)參數(shù)為邏輯流需要的參數(shù)3.Invoke在解析邏輯流時(shí)，參數(shù)是以數(shù)組形式組織的，因此在傳入邏輯流參數(shù)時(shí)，需要用到Array4.變量名bizx對(duì)應(yīng)的值為EOS中邏輯流的全稱員工查詢示例此示例，仍舊以之前EOS項(xiàng)目EOSTripping為原型，將jsp頁(yè)面換為flex頁(yè)面，來(lái)實(shí)現(xiàn)數(shù)據(jù)查詢功能員工查詢示例-Flex界面開(kāi)發(fā)1.Style引用了一個(gè)外部樣式文件，assets/skin/css/style.css，此樣式文件通過(guò)右鍵點(diǎn)擊項(xiàng)目src目錄，“新建-CSS文件”，所有標(biāo)簽的樣式都可寫入此文件，引入樣式文件后通過(guò)標(biāo)簽的styleName屬性來(lái)指定，sytel.css內(nèi)容如下：.panel{vertical-gap:0;background-color:#FFFFFF;cornerRadius:0;header-height:30;highlightAlphas:0.15,0;headerColors:#C2D8DF,#C2D8DF;borderAlpha:1;borderColor:#d8d8d8;borderThicknessLeft:1;borderThicknessTop:0;borderThicknessBottom:1;borderThicknessRight:1;dropShadowEnabled:false;}2.Panel是一個(gè)帶有標(biāo)題的容器，通過(guò)title屬性指定標(biāo)題名稱，如<mx:Paneltitle=“查詢條件”layout=“horizontal“width=“90%”height=“300”styleName=“panel”>,panle的layout屬性也經(jīng)常會(huì)用到，表示它的