JUG DAY FLEX / JEE

2,232 views

Published on

Presentacion de JEE / FLEX para el JUG DAY.

Published in: Technology, Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,232
On SlideShare
0
From Embeds
0
Number of Embeds
37
Actions
Shares
0
Downloads
65
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • JUG DAY FLEX / JEE

    1. 1. FLEX / JEE José Luis Coronel Cortes Arquitecto Tecnológico BEE Concretorías y Sistemas
    2. 2. <ul><li>Introducción </li></ul><ul><li>Flex </li></ul><ul><li>Data Services </li></ul><ul><li>BlazeDS </li></ul><ul><li>Flex – BlazeDS </li></ul><ul><li>Objetos Remotos </li></ul><ul><ul><li>Request (AMF) </li></ul></ul><ul><ul><li>ResultEvent / ResultFault </li></ul></ul><ul><ul><li>Remoting-config.xml </li></ul></ul><ul><li>Servicio de Mensajeria </li></ul><ul><ul><li>Adaptadores </li></ul></ul><ul><ul><li>Destination </li></ul></ul><ul><ul><li>Producer / Consumer </li></ul></ul><ul><ul><li>Subtopic </li></ul></ul><ul><ul><li>message-config.xml </li></ul></ul><ul><ul><li>Selector </li></ul></ul><ul><ul><li>JMS </li></ul></ul>Agenda
    3. 3. <ul><li>Presentador: Soy José Luis Coronel Cortés Ingeniero de la Universidad Tecnológica Metropolitana (UTEM), con 4 años de experiencia en Java. </li></ul><ul><li>Empresa: Me desempeño como Arquitecto Tecnológico de la empresa BEE, creadora de productos de software para la industria financiera con más de 20 años de presencia en Chile, Argentina, Perú y México. </li></ul><ul><li>Objetivo: Mi interés es mostrar a partir de mi propia experiencia y conocimiento, los beneficios de la herramienta Flex® integrada a JEE. Después de esta presentación los asistentes conocerán cuales son los principales beneficios de BlazeDS, el cual es un “Data Source” Open Source desarrollado por Adobe. </li></ul>Introducción
    4. 4. <ul><li>Desarrollo de aplicaciones RIA (Rich Internet Applications) </li></ul><ul><li>Programación en AS3 (Action Script 3) y MXML (Multimedia eXtensible Markup Language). </li></ul><ul><li>Soporte para E4X (ECMAScript for XML). </li></ul><ul><li>Orientado a la “Usabilidad”. </li></ul><ul><li>Open Source (SDK) bajo licencia MPL (Mozilla Public License). </li></ul>FLEX
    5. 5. <ul><li>BlazeDS </li></ul><ul><li>LiveCycle Data Services (LCDS) </li></ul><ul><li>RED5 </li></ul><ul><li>GraniteDS </li></ul><ul><li>WebORB </li></ul>Data Services
    6. 6. Flex - BlazeDS Flash Player AIR Servidor JEE Flex BlazeDS Servicios WEB Servicios HTTP Objetos Remotos Servicio Mensajería Servicios WEB Servicios HTTP Objetos Remotos Servicio Mensajería
    7. 7. Flex - BlazeDS web.xml MessageBroker Servlet services-config.xml messaging-config.xml proxy-config.xml remoting-config.xml Factoria
    8. 8. Flex - BlazeDS BlazeDS Servicio Factoria Spring DAO Hibernate Ibatis
    9. 9. Objetos Remotos <ul><li>Llamadas remotas (RPC) a objetos Java. </li></ul><ul><li>Protocolo AMF3 (binario, basado en SOAP, sobre HTTP). </li></ul><ul><li>Serialización / Deserialización transparente para el desarrollador. </li></ul><ul><li>La respuesta en Flex se atrapa con un ResultEvent para el caso de éxito y un FaultEvent en caso de error </li></ul>Cliente Servidor RemoteObject Java Request (AMF) ResultEvent / FaultEvent
    10. 10. Objetos Remotos Cliente Servidor remoting-config.xml Request ResultEvent RemoteObject Button DataGrid Handler ProductoServicio ProductoDAO
    11. 11. Objetos Remotos Java public class ProductoServicio{ public Producto getProductoPorId(int productoId) throws Exception{ return productoDao.getProductoPorId(productoId); } public List getListadoProductos(){ return productoDao.getListadoProductos(); } } Servidor ProductoServicio ProductoDAO
    12. 12. Objetos Remotos remoting-config.xml <destination id=“ productoServicio ”> <properties> <source> cl.jug.ProductoServicio </source> <scope> application </scope> </properties> </destination> Servidor ProductoServicio ProductoDAO remoting-config.xml
    13. 13. Objetos Remotos MXML / ActionScript <mx:RemoteObject id=&quot; miServicio ” destination=“ productoServicio ” result=&quot; resultadoHandler(event) ” fault=“ errorHandler(event) &quot;/> import mx.rpc.remoting.RemoteObject; var miServicio : RemoteObject = new RemoteObject(); miServicio.destination = “productoServicio&quot;; miServicio.addEventListener(&quot;result&quot;, resultadoHandler); miServicio.addEventListener(&quot;fault&quot;, errorHandler); Cliente RemoteObject
    14. 14. Objetos Remotos Button <mx:Button label=“ Listado Productos ” c lick=&quot; miServicio.getListadoProductos() &quot;/> <mx:Button label=“ Producto por Id ” click=“ miServicio. getProductoPorId (32) &quot;/> Cliente RemoteObject Button
    15. 15. Objetos Remotos DataGrid <mx:DataGrid dataProvider=&quot;{ miServicio.getListadoProductos.lastResult }&quot;/>
    16. 16. Objetos Remotos Handler [Bindable] private var productos : ArrayCollection; private function resultadoHandler(evento : ResultEvent) : void { productos = evento.result as ArrayCollection; }
    17. 17. Objetos Remotos Métodos en el RemoteObject <mx:RemoteObject id=&quot; miServicio ” destination=“ productoServicio ” fault=&quot; faultHandler(event) “> <mx:method name=&quot; getListadoProductos ” result=“ listadoHandler(event) &quot;/> <mx:method name=&quot; getProductoPorID ” result=“ productoHandler(event) &quot;/> </mx:RemoteObject>
    18. 18. Objetos Remotos AS3 / Java <ul><li>package{ </li></ul><ul><li>[RemoteClass(alias=“cl.jug.Producto&quot;)] </li></ul><ul><li>public class Producto { </li></ul><ul><li>public var productoId : int; </li></ul><ul><li>public var nombre : String; </li></ul><ul><li>public var precio : int; </li></ul><ul><li>} </li></ul><ul><li>} </li></ul><ul><li>ResultEvent : La respuesta se guarda en un objeto de tipo Producto </li></ul><ul><li>var producto : Producto = Producto(evento.result); </li></ul>
    19. 19. Servicio de Mensajería <ul><li>Núcleo principal de BlazeDS. </li></ul><ul><li>“ Push” de datos a los clientes conectados. </li></ul><ul><li>Creación de aplicaciones colaborativas. </li></ul><ul><li>En el cliente se define un consumidor ” < mx:Consumer> ” y un productor “ <mx:Producer> ” de mensajes. </li></ul><ul><li>El lugar donde consumir y enviar los mensajes se encontrara definido por el atributo “ destination ” asociado al archivo de configuración de los servicios de mensajería. </li></ul>Data Data Channel Channel Destination
    20. 20. Servicio de Mensajería Adaptadores <ul><li>Los adaptadores en la mensajería determinan que aplicaciones cliente participan en la esta. </li></ul><ul><li>Existen dos tipos : </li></ul><ul><ul><li>Actionscript : Para aplicaciones en las que solo intervienen clientes Flex. (es el usado por defecto). </li></ul></ul><ul><ul><li>JMS : Permite usar clientes Flex y JMS. </li></ul></ul>
    21. 21. Servicio de Mensajería Cliente Servidor Producer Consumer Button Handler messaging-config.xml
    22. 22. Servicio de Mensajería Destination <destination id=“ clientes ”> <channels> <channel ref=“ my-polling-amf ”/> </channels> </destination> <destination id=“ destinoStream ”> <channels> <channel ref=“ my-streaming-amf ”/> </channels> </destination> Servidor Messaging-config.xml
    23. 23. Servicio de Mensajería Producer <mx:Producer id=“ productor ” destination=“ clientes &quot;/> Cliente Producer
    24. 24. Servicio de Mensajería Producer import mx.messaging.messages.AsyncMessage; var mensaje : AsyncMessage = new AsyncMessage(); mensaje.headers.user = “usuario”; mensaje.body = “Mensaje a enviar”; productor.send(mensaje); Cliente Producer Button
    25. 25. Servicio de Mensajería Consumer <ul><li>Destination </li></ul><ul><li><mx:Consumer id=“ consumidor ” destination=“ clientes “ </li></ul><ul><li>message=&quot; mensajeHandler(event)” /> </li></ul><ul><li>Subscribe </li></ul><ul><li>consumidor.subscribe(); </li></ul>Cliente Producer Button Consumer
    26. 26. Servicio de Mensajería Handler import mx.controls.Alert; private function mensajeHandler(evento : MessageEvent) : void { Alert.show(evento.message.body as String, “ Mensaje recibido desde el usuario : &quot; + evento.message.headers.user); } Cliente Producer Button Consumer Handler
    27. 27. Servicio de Mensajería Subtopic Cliente 1 Cliente2 Componente A Componente B Componente A Componente B Servidor Topic Subtopic_A Subtopic_B
    28. 28. Servicio de Mensajería Subtopic private function iniciarAplicacion() : void{ consumidor.subtopic = “chat.cliente1“; consumidor.subscribe(); } private function enviarMensaje(texto : String) : void{ var mensaje : IMessage = new AsyncMessage(); mensaje.headers = new Array(); mensaje.body.mensajeChat = texto; producidor.subtopic = &quot;chat.cliente1“; producidor.send(mensaje); }
    29. 29. Servicio de Mensajería Subtopic – message-config.xml <destination id=&quot; chat “> <properties> <network> <session-timeout> 0 </session-timeout> </network> <server> <max-cache-size> 1000 </max-cache-size> <message-time-to-live> 0 </message-time-to-live> <durable> false </durable> <allow-subtopics> true </allow-subtopics> <subtopic-separator> . </subtopic-separator> </server> </properties> </destination>
    30. 30. Servicio de Mensajería Selector private function iniciarAplicacion() : void{ consumidor.selector = &quot;propiedad1> 30“; consumidor.subscribe(); } private function enviarMensaje(valor : int, texto : String) : void{ var mensaje:IMessage = new AsyncMessage(); mensaje.headers = new Array(); mensaje.headers[&quot;propiedad1&quot;] = valor; mensaje.body.mensajeChat= texto; productor.send(mensaje); }
    31. 31. Servicio de Mensajería Java - Header AsyncMessage mensaje = new AsyncMessage(); mensaje.setDestination(“chat&quot;); mensaje.setClientId(clienteId); mensaje.setMessageId(UUIDUtils.createUUID(false)); mensaje.setTimestamp(System.currentTimeMillis()); mensaje.setBody(“Hola Mundo!!”); Map map = new HashMap(); map.put(&quot;propiedad1&quot;, &quot;5&quot;); mensaje.setHeaders(map); mensajeBroker.routeMessageToService(mensaje, null);
    32. 32. Servicio de Mensajería JMS – message-config.xml <destination id=“chat-topic-jms“> <properties> <server> <durable> false </durable> <durable-store-manager> flex.messaging.durability.FileStoreManager </durable-store-manager> </server> <jms> <destination-type> Topic </destination-type> <message-type> javax.jms.ObjectMessage </message-type> <connection-factory> jms/flex/TopicConnectionFactory </connection-factory> <destination-jndi-name> jms/topic/flex/FlexChatTopic </destination-jndi-name> <delivery-mode> NON_PERSISTENT </delivery-mode> <message-priority> DEFAULT_PRIORITY </message-priority> <acknowledge-mode> AUTO_ACKNOWLEDGE </acknowledge-mode> <transacted-sessions> false </transacted-sessions> </jms> </properties> <channels> <channel ref=&quot;my-polling-amf&quot;/> </channels> <adapter ref=&quot;jms&quot;/> </destination>
    33. 33. DEMOSTRACION
    34. 34. ¿PREGUNTAS?

    ×