Integração do Java + Adobe Flex através do Projeto BlazeDs

Transcrição

1 Integração do Java + Adobe Flex através do Projeto BlazeDs por, Thiago Luiz Ribeiro Rodrigues (R.A: ), 14 de Abril 2009 Este artigo tem por objetivo ensinar como se faz a integração entre o Java e Adobe Flex através do BlazeDS, apresentando uma das opções de integração do Java e outras tecnologias. Java é uma linguagem de programação orientada a objeto e foi desenvolvida na década de 90. Por ser uma linguagem compilada para um bytecode onde é executado por uma máquina virtual, ela se diferencia das convencionais que são compiladas para código nativo. Uma das vantagens é sua portabilidade, ou seja, por ser uma linguagem interpretada, ela pode ser executada em qualquer plataforma ou equipamento que possua um interpretador Java e que tenha sido especialmente compilado para o sistema a ser utilizado. O Java tem se popularizado nesses últimos anos conquistando uma considerável fatia do mercado por possuir algumas características cada vez mais exigidas no dia-a-dia como: - Ser Orientada a Objeto - Portabilidade - Recursos de Rede - Segurança - Entre muitas outras. Num mundo competitivo como o que vivemos, grandes empresas nacionais, multinacionais, bancos, financiadoras, varejistas, e-commerce etc. têm optado pelo Java por ter um peso muito grande na característica de portabilidade não limitando o usuário a ter uma plataforma específica como, por exemplo, sua integração com outras linguagens ou sistemas já existentes. Assim, a empresa pode aproveitar o que já tem e criar novos recursos com qualidade e tecnologia inovadora. O Adobe Flex foi lançado em março de 2004 pela Macromedia, baseado na plataforma do Macromedia Flash, com o flex suportando o desenvolvimento de aplicações ricas para

2 internet. Uma das grandes diferenças do Macromedia Flash para o Adobe Flex é o conjunto de componentes incluindo botões, list boxes, árvores de acesso, data grids e muitos outros objetos de controle de texto, além de conteineres de lay-out. Componentes de gráficos são disponíveis como complementos. Outros atributos são os web services, arraste e solte, caixas de diálogo modais, animações, status da aplicação, validações, e outras interações que rodeiam uma aplicação do tipo framework, assim aumentando a produtividade e a facilidade de desenvolver um sistema Robusto, Flexível e Bonito. Integrando Java e o Adobe Flex Para integrarmos o Java e o Adobe Flex iremos utilizar o projeto BlazeDS de código livre da Adobe que fornece serviço remoto de mensagem, conectando o front-end do Flex aos serviços back-end do Java. Antes de se proceder a integração é necessário antes que se tenha instalados e configurados os seguintes itens: JDK (ou posteriores) Apache Ant juntamente com a formiga-contrib-1.0b2 Eclipse ou Netbeans 6.5 Flex Bulder 3 ou Flex Builder 3 plugin para o Eclipse BlazeDs JBoss4.2.2GA Instalados e configurados todos os itens acima, o próximo passo é começar a integração Java + Adobe Flex. 1 - Criação do Serviço Java Primeiro vamos criar um projeto que vai rodar no nosso servidor, o back-end Java. Crie-o com o nome ServerBlazeDS com a seguinte estrutura:

3 WebContent swf WEB-INF classes flex lib Extraia do zip de download do BlazeDs e extraia o arquivo blazeds.war, vá até o diretório WEB-INF/lib e copie todas os jars e cole no mesmo diretório do seu projeto. Faça a mesma coisa com a pasta flex. Feito isso, vamos contruir nossa classe de serviço Java: public class Service { private List<Map<String,String>> collection; public List<Map<String,String>> getcollection(){ System.out.println( Begin-getCollection() ); collection = new ArrayList<Map<String,String>>(); Map<String, String> joao = new HashMap<String, String>(); joao.put( Nome, Joao ); Map<String, String> Zezinho = new HashMap<String, String>(); Zezinho.put( Nome, Zezinho ); Map<String, String> Mariazinha =new HashMap<String,String>(); Mariazinha.put( Nome, Mariazinha ); collection.add(joao); collection.add(zezinho); collection.add(mariazinha); System.out.println( end-getcollection() ); return collection; } } Essa classe implementa um método simples que retorna uma List de Maps. Isso foi feito por ser uma maneira simples de implementar um objeto não tipado na hora da

4 deserialização em ActionScript, onde vamos ter a mesma estrutura em um Object. É claro que podemos implementar perfeitamente um VO para a mesma operação. Na seqüência, precisamos mapear os nossos serviços como destination, ou seja, fazer com que nossa aplicação possa invocar métodos da nossa classe de serviço distribuída dentro de nosso servidor Java. Dentro da pasta flex abra o arquivo remoting-config.xml e adicione nossa classe Service como destination. <destination id= myservice > <properties> <source>exmplo.amf.ds.service</source> <scope>application</scope> </properties> </destination> Lembre-se do id (no caso myservice ), pois será o nome que sua aplicação flex ira usar para referenciar sua classe remota. Pronto, tudo que precisamos em nosso servidor já foi configurado, agora precisamos criar nosso cliente Flex para acessar nosso serviço. 2-Criação do Flex Client Agora utilizando o Plug-in do Flex Builder podemos seguir os passos New> Flex Project> digite o nome do projeto como ClientBlazeDs e finish, por padrão o plug-in já cria uma Application para você com o mesmo nome do projeto, mais ou menos assim. <?xml version= 1.0 encoding= utf-8?> <mx:application xmlns:mx= layout= absolute > </mx:application Tudo que escrevermos precisa estar dentro desta tag Application porque é onde o compilador flex vai considerar como base para gerar nosso swf. Antes de começar a codificar precisamos indicar ao nosso compilador onde ele deve ler nosso arquivo servideconfig.xml tambem dentro da pasta flex, então clique com o botão direito em cima do projeto, vá em Properties>Flex Compiler>Aditional compiler argumes e adicione: -context-root ServerBlazeDS -services <DIR_PROJETO>\ ServerBlazeDS \WebContent\WEB-INF\flex\services-config.xml Recapitulando:

5 1) Nossa aplicação terá que fazer uma requisição para nosso serviço Java, para isso vamos utilizar um componente chamado RemoteObject que irá fazer a chamada assíncrona de nosso método. 2) Para mostrar de alguma forma esses dados, vamos utilizar o DataGrid para exibição de listas de objetos. <?xml version= 1.0 encoding= utf-8?> <mx:application xmlns:mx= layout= absolute creationcomplete= init() > <mx:script> <![CDATA[ import mx.controls.alert; import mx.collections.arraycollection; import mx.rpc.events.resultevent; [Bindable] private var collection:arraycollection; private function init():void{ ROService.getCollection(); } private function onresult(event:resultevent):void{ collection = event.result? event.result as ArrayCollection : new ArrayCollection(); } ]]> </mx:script> <mx:remoteobject id= ROService destination= myservice requesttimeout= 1 > <mx:method name= getcollection result= onresult(event) fault= {Alert.show( error de conexão)} /> </mx:remoteobject> <mx:panel width= 384 height= 314 layout= absolute verticalcenter= 0 horizontalcenter= 0 > <mx:form width= 100% height= 100% > <mx:datagrid id= grd width= 100% height= 100% dataprovider= {collection} > </mx:datagrid> </mx:form>

6 </mx:panel> </mx:application> 3-Empacotando e distribuindo a aplicação: Vamos criar dentro da pasta swf uma pagina para carregar nosso arquivo *.swf gerado pelo nosso cliente: <html> <head> <meta http-equiv= Content-Type content= text/html; charset=utf-8 /> <title></title> <style> body { margin: 0px; overflow:hidden } </style> <script language= JavaScript type= text/javascript > </script> </head> <body scroll= no > <object classid= clsid:d27cdb6e-ae6d-11cf-96b id= callcenter width= 100% height= 100% codebase= t/swflash.cab > <param name= movie value= /ServerBlazeDS/swf/ClientBlazeDS.swf /> <param name= quality value= high /> <param name= bgcolor value= #869ca7 /> <param name= allowscriptaccess value= samedomain /> <embed src= ClientBlazeDS.swf quality= high bgcolor= #869ca7 width= 100% height= 100% name= callcenter align= middle play= true loop= false quality= high allowscriptaccess= samedomain type= application/x-shockwave-flash pluginspage= > </embed>

7 </object> </body> </html> Agora copie o swf gerado no seu projeto flex dentro da pasta bin-debug para pasta swf do seu projeto servidor, execute o ant de deploy. <project name= BlazeDS-ANT default= pack-blaze > <property name= deploy.dir value=../deploy /> <property name= output.dir value=../output /> <target name= create-directories > <echo>creating output Directories &</echo> <mkdir dir= ${deploy.dir} /> <mkdir dir= ${output.dir} /> <mkdir dir= ${output.dir}/blaze /> <mkdir dir= ${output.dir}/blaze/web-inf/classes /> <mkdir dir= ${output.dir}/blaze/swf /> <echo>done.</echo> </target> <property name= sourceblaze.dir value=../../serverblazeds/src/ /> <target name= clean > <echo>deleting build temp DIR &</echo> <delete dir= ${output.dir}/blaze /> <mkdir dir= ${output.dir}/blaze /> <mkdir dir= ${output.dir}/blaze/web-inf/classes /> <mkdir dir= ${output.dir}/blaze/web-inf/lib /> <echo>done.</echo> </target> <target name= build-blaze depends= create-directories > <echo>compiling classes &</echo> <javac destdir= ${output.dir}/blaze/web-inf/classes encoding= iso debug= on > <src path= ${sourceblaze.dir} /> <classpath> <pathelement path= ${classpath} />

8 <fileset dir= ${sourceblaze.dir}/../webcontent/web-inf/lib > <include name= **/*.jar /> </fileset> </classpath> </javac> <echo>done Compiling.</echo> <echo>copying.swf.</echo> <copy todir= ${output.dir}/blaze > <fileset dir= ${sourceblaze.dir}/../webcontent > <include name= **/*.* /> <exclude name= **/*.svn /> </fileset> </copy> <echo>done.</echo> </target> <target name= pack-blaze depends= build-blaze > <echo>packing WebAPP on WAR file &</echo> <jar destfile= ${deploy.dir}/serverblazeds.war basedir= $ {output.dir}/blaze > </jar> <echo>done.</echo> </target> </project> Pronto. Agora é só testar a aplicação no servidor via browser (navegador) e você terá o Flex acessando os objetos Java. Referências