Integrando Flex + Java + BlazeDS

(Vagner Machado)

Para este tutorial sero necessrios os seguintes requisitos:

- Flex Builder 3 .
http://www.adobe.com/cfusion/entitlement/index.cfm?e=flex3email
- BlazeDS Server.
http://opensource.adobe.com/wiki/display/blazeds/Release+Builds
- Servidor de Aplicao (Glassfish utilizado neste tutorial).
https://glassfish.dev.java.net/downloads/v2ur2-b04.html
- Plugin do Glassfish
com.sun.enterprise.jst.server.sunappsrv_1.0.3
- Plugin WTP (Web Tools Plataform)
Os plugins so facilmente instalados pelo gerenciador de plugins do Eclipse.

H vrias maneiras de comunicar o Java com o Flex, mas em destaque que voc
pode trocar objetos Java/Flex por um protocolo que prov compactao e
tranferncia binria, este o AMF.
Adobe BlazeDS
O BlazeDS um produto OpenSource (Licena LGPL v3) que corresponde
tecnologia JAVA server-side que d suporte tanto para o Remoting assim como ao
Messaging de objetos trocados entre o Java e o Flex/Flash atravs do protocola
AMF que mostra ser 10x mais rpido que outros protocolos utilizados sobre HTTP
em formato XML.

Arquitetura Java+Flex+BlazeDS:

Abaixo segue uma imagem de uma aplicao em Flex (Census) por JamesWard que
mostra grficamente o tempo gasto em transferncias utilizando diversos
tecnologias/mtodos de comunicao. http://www.jamesward.com/census/

- Criando o projeto
Aps fazer o download dos requisitos e configurar o servidor de aplicao vamos
iniciar a criao do projeto.
1 Abra o Flex Builder e crie um novo projeto Dynamic Web Project

De um nome ao projeto e clique em Next.

De outro Next na prxima tela

Ento na prxima altere Java Sorce Directory para src_java para nao haver
confuses quando a integrao for feita.

2 Vamos agora transformar o projeto em um projeto Flex

Clique com o boto direito sobre o projeto
Ento selecione:

Selecione J2EE e clique em Next

Na prxima tela clique em Finish

3 Agora novamente clique com o boto direito sobre o projeto e v em

propriedades, e siga os seguintes passos:
Flex Builder Path
Altere Output folder para WebContent
Este diretrio ser responsvel pelos arquivos gerados pelo flex como Htmls e
SWFs.
V em Library path e remova a pasta flex_libs que no ser mais necessria
pois as bibliotecas iro ser armazenadas no WebContent(veremos mais frente).

4 Vamos agora integrar o BlazeDS ao nosso projeto.

Aps fazer o download do BlazeDS e extrair, copie a pasta WEB-INF para seu
WebContent. Aps ter feito dever ficar assim:

Repare que o web.xml foi substituido, agora o Servelet do BlazeDS est sendo
chamado.

Agora vamos dizer ao compilador do Flex que existe um servidor de AMF levantado, para isso
de um boto direito no projeto JavaFlex -> Properties -> Selecione Flex Compiler -> em
Additional compiler arguments adicione a linha e ok:

-services "../WebContent/WEB-INF/flex/services-config.xml"

5 Vamos agorar criar uma classe java para fazer a comunicao com o Flex
atravs do BlazeDS
Crie uma classe Java no diretrio src_java com o nome OlaMundo
public class OlaMundo {
public String ola(String nome){
return "Ol "+nome;
}
}
Agora vamos fazer com que o BlazeDS reconhea nossa classe e permita que o flex
possa acessa-la atravs de seu protocolo AMF.
Dentro do diretorio WebContent\WEB-INF\flex esto contidos todos os XMLs de
configuraes do BlazeDS
Abra o remoting-config.xml e declare sua classe java
Ficaria assim:
<?xml version="1.0" encoding="UTF-8"?>
<service id="remoting-service"
class="flex.messaging.services.RemotingService">
<adapters>
<adapter-definition id="java-object"
class="flex.messaging.services.remoting.adapters.JavaAdapter"
default="true"/>
</adapters>
<default-channels>
<channel ref="my-amf"/>
</default-channels>
<destination id="servico">
<properties>
<source>OlaMundo</source>
</properties>
</destination>
</service>

6 Acessando o servico por RemoteObject no Flex

Abra seu MXML que foi criado no diretrio flex_src e adicione o RemoteObject, um
TextInput e um Label
Repare que o RemoteObject tem um destination, este destination equivale ao
mesmo destination que foi declarado no remoting-config.xml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:RemoteObject id="servico" destination="servico"/>
<mx:TextInput x="269" y="85" width="175"
change="servico.ola(campo.text);" id="campo"/>
<mx:Label x="269" y="115" width="201" id="label1"
text="{servico.ola.lastResult}"/>
</mx:Application>
No TextInput, a cada mundana de caractere o mtodo ola do servico chamado
e sendo passado como parmetro seu prprio texto
O label, obtem o ultimo resultado no mtodo.

7 Aps ter realizado todos estes passos, um erro gerado.

Abra a aba Problems clique com o direito sobre ele e ento mande recriar os
Templates HTML

8 Agora abra o arquivo web.xml dentro do WebContent\WEB-INF

E na linha
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
</welcome-file-list>
Altere index.html e index.htm para o nome de seu MXML, que no caso foi criado por
padro quando adicionado FlexNatureProject com o nome dado ao seu projeto, no
meu caso ficou JavaFlex.html , mas se voc deu outro nome ao projeto, ponha este
nome. Indicar qual arquivo ser aberto ao iniciar a aplicao.

9 Clique com o boto direito sobre o projeto e d um Build Project

10 Clique com o boto direito sobre o projeto, Run As > Run on Server
Resultado:

Est a integrao bsica Flex+Java+BlazeDS. Espero que tenha ajudado.

At a prxima.
Vagner Machado