Post on 10-Apr-2018
8/8/2019 23_HTTPService con XML
1/57
Flex 4
HTTPService y XML
8/8/2019 23_HTTPService con XML
2/57
Datos en Aplicaciones Flex
Lasaplicaciones Flex
presentan datosa los usuarios
permiten modificar estos datos importados en tiempo de ejecucin
de un almacn de datos desde un servidor
de una base de datos local en caso de Adobe AIR
8/8/2019 23_HTTPService con XML
3/57
Flash Player y Adobe AIR no pueden
comunicarse directamente con datos de
servidor.
Estn diseados para utilizar aplicaciones
servidoras intermedias usandootros
protocolos.
8/8/2019 23_HTTPService con XML
4/57
AccesoaDAtos
Flash Player
Adobe AIR
Datos de ServidorDatos en
servidores LDAP
(Lightweight
Diretory Access
Protocol)
NO DIRECTAMENTE
Aplicaciones middelware
a travs de protocolos
8/8/2019 23_HTTPService con XML
5/57
RPC
Flex incluye tres componentes RPC
Remote Procedure Call (RPC)
permiten integrar aplicaciones Flex con aplicaciones de
servidor
HTTPService
el ms flexible
formato de mensaje que pueden intercambiarse
entre cliente y servidor en runtime intercambia datos como HTTP y XML
RemoteObject
WebService
8/8/2019 23_HTTPService con XML
6/57
Arquitectura REST
Representational State Transfer.
Es unaarquitectura que permite implementar convarias plataformas basadas en cliente
basadas en servidor
Unaarquitectura RESTful permite a un sistema clientelocal recibir recursosalmacenados en un sistemaremotasin necesitar unaaplicacin remota dinmica
de servidor Podemos usar componentes HTTPService en unaaplicacin REST porque puede comunicarse con suspeticiones como un simple URL
8/8/2019 23_HTTPService con XML
7/57
Arquitectura Remote Procedure Call
Arquitectura de software que permite operar
en un entorno remoto con funciones que
pueden ser ejecutadas por separado en varios
entornos.
Estaarquitectura est implementada en Flex
con un servidor Web dinmico que responde a
peticiones HTTP
8/8/2019 23_HTTPService con XML
8/57
Lostres componentes RPC se comunican con
el servidor con el protocolo HTTP
Su diferencia est en el formato de losmensajes
8/8/2019 23_HTTPService con XML
9/57
HTTPService
Hace peticiones HTTP estndar a un servidor
Web
Utilizatexto planoo XML como formato demensaje
Podemos usar el componente HTTPSErvice
para crear aplicaciones RPC con cualquier
servidor, porque usando XML como formato
de mensaje es universal
8/8/2019 23_HTTPService con XML
10/57
RemoteObject
Se comunica con aplicacionesservidor usandobinario AMF
Slo pueden funcionar con servidores que
implementan AMF Productos Adobe
ColdFusion
LiveCycle Data Services
BlazeDS
ASP.NET PHP
Java Enterprise Edition (J2EE)
8/8/2019 23_HTTPService con XML
11/57
WebService
Realiza peticiones y maneja las respuestas de
lasaplicacionesservidoras con mensajes en
formato SOAP
Slo puede trabajar con servidores que usan
protocolo SOAP
ColdFusion
ASP.NET
J2EE
8/8/2019 23_HTTPService con XML
12/57
Crear Aplicaciones de datos
Tareasa realizar:
Conectar aserviciosalojados en servidores
remotos
Convertir datos devueltosa clases value object
fuertementotipados
Enlazar datos devuletosa controles visuales como
DataGrid o List Gestionar entrada de datos en formularios
8/8/2019 23_HTTPService con XML
13/57
Estas caractersticas estn disponibles en losservidores:
Adobe ColdFusion
LiveCycle Data Services
BlazeDS
PHP
proveedores de serviciosWeb basados en SOAP proveedores de datos REST que devuelven datos
XML
8/8/2019 23_HTTPService con XML
14/57
Conectar a datos
La fuente de datosser un fichero XML de
nuestraaplicacin
8/8/2019 23_HTTPService con XML
15/57
Solucin UseDataConnection.mxml
men Data Connect HTTP
en Operationsselecciona el fichero XML
el cdigo generado est creado en el paqueteServices
8/8/2019 23_HTTPService con XML
16/57
VistaData/Services
las conexiones de datosse gestionan en la
vistaData/Service
Nos permite seleccionar el servicio
modificar sus propiedades
configurar el tipo de datos devueltos
enlazar los datosa un control visual
boton derecho en el control y enlazar a datos
8/8/2019 23_HTTPService con XML
17/57
objeto HTTPService
Adems de lasopciones de generar el cdigo,
podemostb declarar y configurar el objeto
HTTPService
Comosiempre, un objeto HTTPService puede
ser declarado
MXML
cdigo AS
8/8/2019 23_HTTPService con XML
18/57
Crear un objeto HTTPService
debemos declarar el HTTPService en la zona decomponentes no visuales
8/8/2019 23_HTTPService con XML
19/57
Declarar con AS
import mx.rpc.http.HTTPService;
private var myService:HTTPService =
new HTTPService(data/contacts.xml);
8/8/2019 23_HTTPService con XML
20/57
Propiedades y mtodos de
HTTPService
concurrency:String. regla que determina cmo gestionar mltiples
llamadas concurrentes
method:String. mtodo HTTP usado
resultFormat:String. formato en el que los datossern retornados
showBusyCursor:Boolean. url:String.
direccin a donde la peticin se envia
8/8/2019 23_HTTPService con XML
21/57
url
myHTTPService.url = data/contacts.xml;
myHTTPService.url =
http://www.myserver.com/data/contacts.xml;
8/8/2019 23_HTTPService con XML
22/57
resultFormat
array.
e4x.
XML bien formado que puede ser modificado con sintaxys EcmaScriptpara XML (E4X)
flashvars.
datos con formato de par nombre/valor
firstName=Joe&lastName=Smith
object(por defecto).
XML bien formado se retornan como un arbol de objetos AS
text.
xml. XML bien formato es retornado como un objeto XMLNode de AS que
puede ser gestionado con codigoDocument Object Model (DOM).
8/8/2019 23_HTTPService con XML
23/57
Enviar y Recibir datos
Enviamos una peticin HTTP con el mtodo
send() del objeto HTTPRequest
8/8/2019 23_HTTPService con XML
24/57
Solucin
8/8/2019 23_HTTPService con XML
25/57
Tambin podemos enviar la peticin con un
botn
8/8/2019 23_HTTPService con XML
26/57
Comunicaciones Asncronas
Los componentes RPC envan y reciben datos
asncronos.
Cuando envias una peticin, la mquina virtual de
Flash Player NO para la ejecucin del cdigo y
espera que los datossean devueltos.
Las peticionesse envan y las respuestasse
gestionan con event listeners.
8/8/2019 23_HTTPService con XML
27/57
Gestionar respuestas HTTPService
con binding expression que hacen referenciaa
los datos devueltos
propiedad lastResult
si resultFormat es por defecto un objeto, la propiedad
lastResulthace referenciaa la clase ObjectProxy que
representa el documento XML
con event listeners que ejecutan cdigo Ascuando los datosson devueltos
8/8/2019 23_HTTPService con XML
28/57
el nodo rowse repite varias veces en el fichero
XML (fichero contacts.xml)
8/8/2019 23_HTTPService con XML
29/57
Ejemplo
Rellenar un DataGrid con los datos del fichero
contacts.xml
8/8/2019 23_HTTPService con XML
30/57
Solucin
HTTPServiceWithBindings.mxml
8/8/2019 23_HTTPService con XML
31/57
Gestionar respuestas con event
listener
Gestionar result event
Cuando los datosse devuelven de un servidor
objeto HTTPService dispara un evento result
mx.rpc.events.ResultEvent. This ResultEvent
8/8/2019 23_HTTPService con XML
32/57
Podemos gestionar y guardar datos usando el eventoresult:
Declarar bindable una variable fuera de cualquier funcinpara que acte como referencia persistente en la devolucinde datos.
Podemos cast la variable a ArrayCollection si esperamoselementos repetidos en los datos. import mx.collections.ArrayCollection; [Bindable]
private var myData:ArrayCollection
Crea un funcin que maneje el evento y ser llamada cuandose despecha el evento.
Esta funcin recibe un argumento event de tipo ResultEvent private function resultHandler(event:ResultEvent):void
{
}
8/8/2019 23_HTTPService con XML
33/57
En la funcin manejadora del evento,
podemos usar la expresin event.result para
referirnosa los datos enviados desde el
servidor.
Nos movemos por la jerarqua XML para
conseguir los datos repetidos deseados y los
asignamosa la variable AC
myData = event.result.contacts.row;
8/8/2019 23_HTTPService con XML
34/57
addEventListener
Podemos escuchar el evento result cuandose llame aun mtodoaddEventListener
var myService:HTTPService = new HTTPService();
myService.url = data/contacts.xml;
myService.addEventListener(ResultEvent.RESULT,resultHandler);
8/8/2019 23_HTTPService con XML
35/57
Ejemplo
Aplicacin que recibe datos usando el objeto
HTTPService con event result.
Los datosse almacenan de forma persistentecon AC en una variable Bindable que aparece
en un DG usando binding expression.
8/8/2019 23_HTTPService con XML
36/57
Solucin - HTTPResultEvent
import mx.rpc.events.ResultEvent;
import mx.collections.ArrayCollection;
[Bindable]
private var myData:ArrayCollection
protected function contactService_resultHandler(
event:ResultEvent):void
{
myData = event.result.contacts.row;
}
]]>
8/8/2019 23_HTTPService con XML
37/57
Evento fault
Si el request HTTPService da error, se disparael evento fault.
mx.rpc.events.FaultEvent.
Su propiedadesson:
faultCode:String.
faultDetail:String.
faultString:String. mensaje de error
message:String.
8/8/2019 23_HTTPService con XML
38/57
Gestionar error fault
var myService:HTTPService = new HTTPService();
myService.url = data/contacts.xml;
myService.addEventListener(ResultEvent.RESULT,resultHandler);
myService.addEventListener(FaultEvent.FAULT,faultHandler);
8/8/2019 23_HTTPService con XML
39/57
Ejemplo
Uso de evento fault en un objeto HTTPService
8/8/2019 23_HTTPService con XML
40/57
Solucin - HTTPFaultEvent
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
[Bindable]
private var myData:ArrayCollection
private function resultHandler(event:ResultEvent):void
{
myData = event.result.contacts.xml;
}
private function faultHandler(event:FaultEvent):void
{
Alert.show(event.fault.faultString, event.fault.faultCode);
}
]]>
8/8/2019 23_HTTPService con XML
41/57
Value Objects
Datos recibidos con formato XML con el
componente HTTPService siempre se
almacenan como AC.
Pero podemostrabajar con clases de value
objects fuertemente tipados.
Debemos entonces, crear un cdigo que
transforme las instancias Object en value
objects.
8/8/2019 23_HTTPService con XML
42/57
Convertir a value objects
Crear una clase value object con las propiedades adecuadas y el mtodoconstructorpara aceptar como argumento un tipo de dato como la claseObject de AS.
Dentro del mtodo constructor, pasar los valores de sus propiedades alas propiedades equivalentes de la instancia actual en el value object.
public function Contact(data:Object = null)
{
if (data != null)
{
this.contactid = Number(data.contactid);
this.fir
stna
me = data
.first
na
me;this.lastname = data.lastname;
... setadditional properties ...
}
}
8/8/2019 23_HTTPService con XML
43/57
En tiempo de ejecucin, cuando manejamos el evento result, recorremosel AC creando una nueva instancia de value object para cada elemento
Reemplazamos el objeto original con el mtodo setItemAt()
private function resultHandler(event:ResultEvent):void
{var obj:Contact;
myData = event.result.contacts.row;
for (var i:int=0; i
8/8/2019 23_HTTPService con XML
44/57
Ejemplo
Recibir datos del servidor y recorrer el AC para
reemplazar el Object con value object.
Cuandoseleccionemos una fila del DG, una
instancia bindable del value objectse rellena
con los datosseleccionados y se muestran en
un Panel
8/8/2019 23_HTTPService con XML
45/57
Solucin - HTTPValueObjects
import mx.collections.ArrayCollection;
import mx.events.ListEvent;
import mx.rpc.events.ResultEvent; import vo.Contact;
[Bindable]
private var myData:ArrayCollection
[Bindable]
private var currentContact:Contact;
private function contactService_resultHandler(event:ResultEvent):void
{
var obj:Contact;
myData= event.result.contacts.row;
for (var i:int=0; i
8/8/2019 23_HTTPService con XML
46/57
Pasar parmetros
Con el componente HTTPService podemos
hacer llamadasa pginas dinmicas
gestionadas por unaaplicacin server.
El sintaxis para pasar parmetros es igual si
usamos peticionesGET o POST
parmetros empaquetado en un objeto AS
parmetros vinculados (bound) que se envian en
la declaracin del objeto HTTPService
8/8/2019 23_HTTPService con XML
47/57
Parmetros nombrados
En primer lugar, creamos una instancia de un
Object AS.
El Object es dinmico y pueden aadirse
propiedades en tiempo de ejecucin.
Establecemos cada parmetro con el nombre
de la propiedad y usamos el mtodosend()
8/8/2019 23_HTTPService con XML
48/57
private function sendData():void
{
var params:Object = new Object();params.firstname=Joe;
params.lastname=Smith;
contactService.send(params);}
8/8/2019 23_HTTPService con XML
49/57
Otraopcin
private function sendData():void{
contactService.send({firstname:Joe,
lastname:Smith});
}
8/8/2019 23_HTTPService con XML
50/57
Si usamosGet, los parmetrosse ven en la
direccin
Si usas Post, los parametrosse aaden al final
del request
8/8/2019 23_HTTPService con XML
51/57
Parmetros enlazados (bound)
Podemos crear parametros bound en la
declaracin HTTPServicey enviarlas en el
cdigo.
Declaramos una variable value object bindable
paraalmacenar los datos
[Bindable]
private var myContact:Contact;
8/8/2019 23_HTTPService con XML
52/57
Podemos enviar los parmetros con sus valoresusando binding expressions
{myContact.firstname}
{myContact.lastname}
8/8/2019 23_HTTPService con XML
53/57
Ejemplo
Necesitamos unaaplicacin servidor que
puede recibir y responder peticiones
parametrizadas
8/8/2019 23_HTTPService con XML
54/57
Cross-domain
Si Flash Player necesitahacer requestaotro
dominio diferente de donde se ha descargado
el actual fichero Flash, necesita permisos.
Si estosucede, Flash Player busca las politicas
de cross-domain.
8/8/2019 23_HTTPService con XML
55/57
Permisos Cross-domain son necesarios para
todas las peticiones HTTP a dominios remotos
HTTPService
RPC (remote procedure calls) con Web Service y
RemoteObject
descargar imgenes con componentes Image o
SWFLoader URLLoader o XMLSocket
8/8/2019 23_HTTPService con XML
56/57
El fichero cross-domain es un fichero XML que
se llama crossdomain.xml .
Est colocado en root del dominio remoto.
Si cuando lo necesita, FP encuentra el fichero,
mirasus permisos.
8/8/2019 23_HTTPService con XML
57/57
cross-domain.xml