22.01.08
Posted in flex
at 23:21
En el post anterior publiqué como hacer peticiones REST, más en concreto, al servicio web que nos ofrecía MyStrands. Desarrollando la aplicación en mí casa todo iba muy bien y sin problemas. El verdadero problema surgió cuando subí la aplicación a mi servidor de hosting e intentaba ejecutar la aplicación descargándomela desde el.
La aplicación se iniciaba con normalidad, pero cuando realizaba una petición de información al servicio web de MyStrands me aparecía el siguiente problema: Error #2048. Violación de Seguridad del Sandbox: No se pueden cargar datos del sitio https://mystrands.com…. desde www.antonioserrano.es/…, a lo cual dije ¿¿Pero que coj…..??
Buscando por mil millones de páginas de google, consultándo la documentación de adobe, etc, etc. descubrí que una aplicación descargada desde un sitio web (por ejemplo el mío), no puede ejecutar código que está en otro (por ejemplo el de mystrands). Si buscáis como solucionar este tema os encontraréis mucho con el famoso fichero crossdomain.xml e intrucciones del tipo Security.allowDomain() y Security.allowInsecureDomain(). Estas soluciones están bien si lo que quieres es interactuar con otra aplicación en flex, la cual deberá cargar el fichero de política de accesos (el crossdomain.xml), con la instrucción Security.loadPolicyFile(), y además incluir las instrucciones de Security para permitirnos el acceso.
Pero, ¿Y si no quieres interactuar con otra aplicación flex y quieres invocar un servicio web o algo similar? Pues tras mucho, mucho buscar no he encontrado solución directa. Para el ejemplo anterior lo que tuve que hacer fue incluir en mi servidor una página en php, a la cual yo llamo desde flex y ésta a su vez llama al servicio de mystrands y me devuelve el xml resultante. Es decir, una persona se descarga mi aplicación desde mi servidor, y la única forma de que funcione las llamadas es, realizarlas contra mi servidor, y que mi servidor las realice a mystrands a modo de proxy.
Para mi ejemplo de mystrands, utilicé este archivo php, que me hizo Miguel (un autentico crack, al cual le agradezco mucho su ayuda). Yo utilicé este archivo porque mi servidor es php, pero por ejemplo, se puede utilizar un servlet, página en asp o lo que sea.
Un saludo!! PD: si alguien sabe como resolver el problema sin necesidad de utilizar ninguna pagina de servidor intermedia se lo agradeceré muchísimo
Permalink
20.01.08
Posted in flex
at 18:05
Para aprender el funcionamiento de las llamadas REST en Flex y Air (algo totalmente nuevo para mí), he realizado una aplicación que se conecta con el servicio que nos ofrece MyStrands. Para el que no lo conozca, mystrands en una comunidad, en la que los usuarios puntúan a los artistas, sus discografías, debaten sobre ellos, etc. Dentro de MyStrands, tenemos una sección para desarrolladores, OpenStrands, en la cual se nos ofrece un api para obtener información de discografías, canciones, opiniones de los usuarios, etc. Para poder utilizar dicha api, será necesario registrarse para obtener un subscriberId, es decir, una clave personal de desarrollador para poder efectuar las llamadas al api, y descargarse la documentación para ver cómo realizar dichas llamadas.
Para este ejemplo he utilizado el framework de programación guasax. Dentro de la web de guasax, o en el blog de su autor, Ángel Blesa, podréis ver en detalle las posibilidades que ofrece. El motivo de haberlo utilizado en este ejemplo es para ver los pasos a la hora de realizar las llamadas de una forma mucho más limpia que sin utilizar ningún framework.
Para realizar las llamadas, declararemos los servicios a llamar en el Service Locator de la siguiente manera:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<guasax:ServiceLocator
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:guasax="es.guasax.services.*" >
<mx:HTTPService id="nombre_del_servicio"
url = "url que queremos llamar"
method="get"
contentType="application/x-www-form-urlencoded"
showBusyCursor = "true"
useProxy = "false"
requestTimeout = "120"
result="event.token.resultHandler( event )"
fault="event.token.faultHandler( event )" >
</mx:HTTPService>
</guasax:ServiceLocator> |
Dentro del ServiceLocator, nos definiremos tantos HTTPService como necesitemos. Cada HTTPService tendrá una url para llamar a un servicio u a otro.
Para llamar a los servicios y procesar su respuesta. Cada llamada al servicio constará de tres funciones: una para realizar la llamada, otra para procesar la respuesta en caso de éxito en la llamada, y otra para procesar la respuesta en caso de error en la ejecución del servicio. Esto en guasax se conoce como una action y se implementa de la siguiente manera:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
|
/**
* Realiza la peticion del servicio
*/
public function llamadaServicio(...):void{
var params : Array = new Array();
params["nombre_parametro"] = "valor_parametro"; //tantos como sean necesarios
ServiceLocator.getInstance().executeService(
"nombre_servicio", //definido en el codigo anterior
"", //Cadena vacia en este caso. Los httpservice en guasax no necesitan este parametro
params, //Parametros que acabamos de definir
llamadaServicioOnResult, //funcion en caso de exito
llamadaServicioOnFault, //funcion en caso de error
this); //Clase que recoge el resultado
}
/**
* Funcion en caso de exito
*/
public function llamadaServicioOnResult(event:ResultEvent):void{
var resultado:XML = event.result as XML
//Parseo del XML
}
/**
* Funcion en caso de error
*/
public function llamadaServicioOnFault(event:FaultEvent):void{
Alert.show(event.message.toString()); //Mostramos el mensaje de error
} |
Para ver mucho mejor todo esto podéis ver el siguiente ejemplo. Esta sin completar, pero para ver el funcionamiento de las peticiones REST es suficiente. En el buscador introducimos el nombre del artista o grupo que queremos buscar, y una vez lo tengamos en la lista de resultados, podemos consultar su discografía y posteriormente la información de cada disco en detalle, con las canciones que lo conforman y demás información.
Este ejemplo ha sido compilado con la beta3 del flex builder. Podéis ver y descargar el código fuente del proyecto pulsando con el botón derecho sobre la aplicación y dándole a view source.
Espero que sirva de ayuda. Saludos!!
Permalink
10.12.07
Posted in air
at 23:36
Una de las nuevas funcionalidades que nos encontramos dentro de la programación en Adobe Air, es la capacidad de poder arrastrar archivos y directorios desde nuestro escritorio, o desde una ventana de explorador del sistema, a nuestra aplicación, y tener así automáticamente una referencia a ellos. Esto se conoce como Native Drag & Drop.
Para utilizar este Drag & Drop, sólamente tenemos que monitorizar desde la aplicación principal dos eventos. El evento NativeDragEnter, que se dispara cuando entramos en nuestra aplicación arrastrando algún archivo, y el evento NativeDragDrop que se ejecuta cuando soltamos los archivos arrastrados dentro de la aplicación. Para ejecutar el NativeDragDrop previamente tenemos que “dar permiso” a la aplicación para aceptar los archivos que estan siendo arrastrados. Esto se realiza con la intrucción DragManager.acceptDragDrop(this), y se utiliza cuando comprobamos los archivos en el evento NativeDragEnter.
Ambos eventos reciben como parámetro un objeto de la clase NativeDragEvent, dentro del cual, tenemos una propiedad llamada clipboard, que es un objeto de la clase Clipboard, que contiene toda la información de los archivos que estamos arrastrando.
Desde este link podéis descargar el código fuenta de un ejemplo sencillo de utilización. Se trata de un programa que a través de Native Drag & Drop muestra la información de los archivos que le estamos pasando en un FileSystemDataGrid. Sólo admite archivos con extensión .mp3, si dentro de los archivos que arrastramos hay un archivo con otra extensión, o un directorio, rechaza el Drag & Drop.
Podéis descargar el archivo ejecutable y ver el código fuente pulsando con el botón derecho en la aplicación y dándole a view source (es necesario tener el runtime de AIR), o descargar el código fuente y compilarlo en vuestro flex builder.
Espero que sirva de ayuda. Un saludo!!
Editado: Se me olvido mencionar que este ejemplo está compilado con la beta 2 del runtime de AIR. Como muy bien dice ablesa, si solo tienes instalada la beta 3 del runtime, el ejemplo no funcionará. Habrá que tener instalada la beta2.
Permalink
28.11.07
Posted in air
at 23:18
Dentro de la gama de componentes de Adobe AIR, disponemos de varios para poder ver el contenido de nuestro disco duro. De todos ellos, los más interesantes son:
- FileSystemTree: Es como un componente tree normal, solo que las ramas del árbol son los subdirectorios del directorio padre, y las hojas los archivos finales.
- FileSystemDataGrid: Es un datagrid, en el cual, cada una de las filas es un directorio o fichero. Si es un directorio, al hacer doble click sobre él, cambia los items del datagrid, mostrando la información que hay dentro de él, y así sucesivamente. Es un componente muy completo, ya que muestra información sobre tamaño, fecha de modificación, etc. de los ficheros
- FileSystemList: Este componente es igual que el anterior, pero en lugar de visualizarse en un datagrid, se visualiza en un componente list, mostrando sólamente el nombre del subdirectorio o fichero
Estos dos últimos, además poseen dos propiedades, backHistory y fowardHistory, que almacenan el historial de directorios que hemos ido visitando. En función del valor de estas propiedades, automáticamente se actualizan otras cuatro propiedades booleanas: canNavigateBack, canNavigateFoward, canNavigateUp y canNavigateDown, las cuales nos indican si podemos navegar atrás, alante, subir un directorio o bajar un directorio.
Como ejemplo básico de manejo de estas propiedades, he realizado un ejemplo muy simple. Se trata de una aplicación que lanza una ventana tipo explorador de directorios de windows, y en función del historial, habilita o deshabilita los botones de volver atrás, alante, etc.
Podéis descargar el archivo ejecutable, para ello deberéis tener el runtime de AIR instalado (supongo que si :D), o descargar el código fuente de la aplicación y compilarlo en vuestro flex builder 3. Espero que sirva de ayuda.
Saludos!!
Editado: Este ejemplo está compilado con la beta 2 del runtime de AIR, si te instalaste directamente la beta 3 sin tener la uno ni la dos, es posible que no funcione.
Permalink
24.11.07
Posted in Personal
at 19:13
Hello world!! Como este va a ser un blog relacionado mayormente con la programación, el título me viene a huevo :).
Como llevo casi un año programando en flex (y ahora empezando con AIR) y me han surgido un montonazo de problemas, y como la ayuda que hay en castellano es más bien escasa, comentaré problemas que me he ido encontrando para ayudar a los programadores de RIAs de habla hispana como yo.
Si alguien tiene algún problema en concreto, y no he abierto ningún post sobre ello, admito propuestas (Otra cosa es que sepa como resolverlas :P). Para ello envíame un e-mail a esta dirección
Vamos allá!!
Permalink
