fbpx
 

Tutorial de Introducción a Alamofire [Parte 1]

Tutorial de Introducción a Alamofire [Parte 1]

1. Introducción

 

Alamofire. El tutorial de esta semana va a estar basado en Alamofire.

 

Alamofire logo

Si nunca has oido hablar de él, no te preocupes, vamos a comenzar desde cero en el uso de esta librería.

Si por el contrario, si que conoces Alamofire o incluso ya lo has utilizado en alguno de tus proyectos, aún así, te recomiendo que sigas leyendo y eches un vistazo a este tutorial. Puede que encuentres algún apartado interesante 😉

En un apartado posterior veremos en detalle en que consiste Alamofire. Por ahora es suficiente con que sepas que se trata de la librería más importante de Networking en Desarrollo iOS, programada íntegramente en Swift.

Por lo que si te interesa el Desarrollo iOS, es importante que conozcas el funcionamiento de Alamofire.

 

2. ¿Qué vamos a ver en este tutorial?

 

Vamos a desarrollar una aplicación completa que dispondrá de una UIStackView en pantalla, donde mostraremos información recuperada de servidor utilizando la librería Alamofire.

Se trata de un tutorial bastante completo, donde podrás ver en detalle como obtener datos a través de peticiones de red y como mostrar estos datos en pantalla.

Para no desarrollar un tutorial excesivamente grande, voy a dividirlo en 2 partes. En esta primera parte veremos toda la teoría que necesitas dominar para trabajar con Alamofire. En la segunda parte del tutorial nos centraremos en la parte práctica y será ahí donde aplicaremos lo aprendido, desarrollando nuestra aplicación.

Estos son todos los temas que vamos a ver en el tutorial completo:

  • ¿Cuales son las mejores opciones para realizar peticiones a Servidor?
  • ¿En qué consisten los verbos HTTP?
  • Trabajando con JSON
  • Funcionamiento de Alamofire
  • Mockea tus servicios con Apiary
  • Realizando peticiones con Alamofire
  • Parseando la respuesta del servidor
  • Mostrando datos en nuestra Aplicación iOS

 

Como puedes ver, una sencilla aplicación con una UIStackView nos permitirá trabajar con conceptos fundamentales del Desarrollo iOS como peticiones a servidor, parseo de respuestas y muestra de datos recibidos.

 

3. La Aplicación que vamos a desarrollar

 

Al terminar el tutorial, nuestra aplicación tendrá este aspecto:

Alamofire App funcionando

Me aburre soberanamente todo este mundo de los Pokemon, pero como hoy no estoy especialmente brillante, me conformaré con ellos como ejemplo para nuestra aplicación

 

Se trata de una aplicación con una interfaz extremadamente sencilla, ya que lo único que muestra son 3 imágenes y 3 labels. Sin embargo, la parte invisible al usuario es más compleja y es perfecta para entender el funcionamiento de Alamofire.

Lo que haremos realmente será recuperar a través de Alamofire un conjunto de datos en formato JSON y mostrarlos en pantalla a través de una UIStackView.

Se trata de un conjunto pequeño de datos, que consiste en 3 imágenes y 3 nombres. Podríamos añadir una mayor cantidad de datos al tutorial, pero para poder revisar el funcionamiento de Alamofire, es más que suficiente.

 

4. Peticiones a Servidor en una Aplicación iOS

 

Si pretendes desarrollar una Aplicación iOS medianamente ambiciosa, necesitas gestionar las peticiones a servidor desde tu App.

Para realizar este trabajo existen infinidad de alternativas.

Voy a mencionar las que son, desde mi punto de vista, las 3 mejores opciones:

 

URLSession

 

Se trata de la opción oficial que Apple ofrece a todos los Desarrolladores iOS para gestionar tareas de red.

Es una suite completa de métodos que te permiten gestionar peticiones HTTP desde tu Aplicación iOS.

Puedes ampliar información sobre esta API directamente aquí.

 

AFNetworking

 

AFNetworking es la librería de networking más usada en Desarrollo iOS con muchísima diferencia.

Fue desarrollada por Mattt Thompson a modo de envoltorio sobre las propias librerías de Apple.

Su objetivo es hacernos la vida más sencilla a los desarrolladores, ofreciéndonos una sintaxis mas clara y ocupándose de tareas tediosas a las que todo Desarrollador iOS debe enfrentarse en sus peticiones a servidor.

Si estás trabajando en un proyecto que fue creado hace 2 ó 3 años, es muy probable que estés utilizando esta librería para gestionar las peticiones de red.

Puedes ampliar información sobre esta librería, aquí.

 

Alamofire

 

De nuevo nuestro amigo Mattt Thompson acaparando la lista.

Alamofire es otra librería creada por él mismo, para ayudarnos en las mismas funciones que AFNetworking.

¿Entonces cual es la diferencia?

Mientras que AFNetworking fue desarrollada en Objective-C, Alamofire está escrita en Swift.

Esto nos permite, utilizar esta librería siempre que estemos trabajando en un proyecto en Swift, de forma que los patrones de la librería y del propio lenguaje de desarrollo encajen perfectamente.

Puedes ampliar información sobre Alamofire, aquí.

Por tanto, ten en cuenta lo siguiente:

 

Proyecto en Objective-C -> Utiliza AFNetworking

 

Proyecto en Swift -> Utiliza Alamofire

 

5. Los Verbos HTTP

 

Es importante que conozcas los verbos HTTP antes de comenzar a trabajar con peticiones a servidor.

Cuando trabajamos creando software basado en una arquitectura cliente-servidor, en muchas ocasiones, nos integraremos con un estilo de arquitectura de software conocido como REST.

El objetivo de este tutorial no es el de explicar en detalle en que consiste este tipo de arquitectura, por lo que si quieres ampliar información puedes acceder aquí..

Uno de los pilares básicos de un sistema RESTful es el uso de una serie de verbos que nos permitirán interactuar con el backend de nuestra aplicación y poder realizar así las operaciones que necesitemos en cada momento.

Los 4 verbos principales que te permitirán realizar operaciones en el sistema RESTful son los siguientes:

 

GET

 

El verbo GET te permite solicitar y obtener datos del servidor. A través de él puedes recuperar uno o varios elementos.

 

Cada vez que navegas por Internet y accedes a una web, estás realizando una petición GET, que te permitirá recuperar todos los datos de esa página concreta

 

POST

 

El verbo POST sirve para enviar y almacenar datos en el servidor.

 

Cuando creas una nueva publicación en Facebook o escribes un tuit en Twitter, estás realizando una petición POST a los servidores de Facebook y Twitter

 

PUT

 

Utilizaremos el verbo PUT cuando queramos modificar algún elemento ya creado en el servidor.

 

Si en algún momento has editado una publicación tuya en Facebook, la aplicación realiza una petición PUT para poderla llevar a cabo

 

DELETE

 

Por último usaremos el verbo DELETE cuando queramos eliminar contenido del servidor.

 

Habrás realizado una petición DELETE si en algún momento has eliminado una publicación en cualquier red social que utilices

 

Estos 4 verbos son la base de cualquier sistema RESTful y explican gran parte del funcionamiento de Internet.

Seguro que has oido hablar alguna vez del acrónimo CRUD. Cuando hablamos de CRUD nos referimos a:

  • Create
  • Read
  • Update
  • Delete

Es decir, las 4 operaciones que podemos realizar con los verbos HTTP que acabamos de ver.

Ahora que ya tienes una base teórica sobre el funcionamiento del protocolo HTTP, pasemos al siguiente concepto que debes dominar.

 

6. JSON

 

Alamofire JSONlogo

En este Tutorial vamos a utilizar JSON como formato de intercambio de datos.

Seguramente conozcas de arriba a abajo en que consiste JSON, sin embargo, como uno de los principios de EfectoApple es realizar Tutoriales que cualquiera pueda entender, independientemente de su experiencia y nivel de conocimientos, en este apartado vamos a ver rápidamente lo que es JSON.

JSON es el acrónimo de JavaScript Object Notation.

Se trata un formato de texto ligero para el intercambio de datos. Se utiliza comúnmente para representar datos estructurales y para intercambiar datos en aplicaciones cliente-servidor.

Es una alternativa moderna al clásico XML.

Una gran cantidad de los servicios que utilizamos todos los días tienen APIs basadas en JSON. La mayor parte de las aplicaciones de iOS como Twitter o Facebook envían datos a los servicios web de sus backends en formato JSON.

Como ejemplo, aquí tenemos una representación de un objeto Película en formato JSON:

En este JSON de ejemplo, podemos observar un objeto Película con los siguientes campos:

  • Título
  • Fecha de lanzamiento
  • Director
  • Reparto (Un array de diccionarios, donde cada diccionario representa a un actor y su personaje)

 

Como puedes ver, los datos en formato JSON son más fáciles de leer y parsear que en XML.

Si nunca antes habías oído hablar de JSON y quieres aprender más sobre él, puedes echar un vistazo a esta Guía de JSON.

 

7. Funcionamiento de Alamofire

 

Centrémonos entonces en explicar el funcionamiento de Alamofire.

alamofire other logo

Funciones de Alamofire

 

Las 2 funciones principales que nos ofrece Alamofire a los Desarrolladores iOS son:

  • Funciones de Networking

Se encarga de todas las operaciones de red (petición y respuesta). Al final de todas las capas que conforman Alamofire, termina utilizando la solución oficial de Apple: URLSession.

  • Funciones de Serialización

Nos permite procesar el body de las peticiones y respuestas (json, xml, etc)

 

Petición Simple en Alamofire

 

Para realizar una petición simple a una URL haríamos lo siguiente:

Como ves, se trata de un código muy sencillo. Utilizamos el método request() pasándole la URL y al objeto que nos devuelve ese método, podemos hacerle .response y pasarle una closure.

Esta closure recibirá los datos de la respuesta, cuando la respuesta llegue del servidor.

A través del objeto response nosotros podemos obtener toda la información de la petición a servidor. Veamos toda la información que puede darnos el objeto response:

  • Obtener la petición que hemos realizado al servidor:

  • Obtener la respuesta del servidor:

  • Obtener los datos binarios:

  • Obtener el error en la petición (en el caso de que se haya producido):

  • Obtener estadísticas de tiempos de respuesta, latencia y otras opciones:

Esta sería la forma más basica de realizar una petición HTTP con Alamofire.

 

Serialización de respuestas en Alamofire

 

Para utilizar los serializadores de Alamofire, en lugar de usar el método response, podemos utilizar cualquiera de estos:

Deserializa los bytes de la respuesta a String.

Deserializa los bytes de la respuesta a JSON.

Deserializa los bytes de la respuesta a plist.

Como puedes ver, no existe por defecto un serializador para XML, pero nosotros mismos podemos crear uno si lo necesitamos.

 

Configurando el verbo de la petición

 

¿Qué pasa si en el momento de la petición queremos especificar el verbo HTTP que vamos a utilizar?

Pues que en el momento de la petición, deberemos añadirlo en nuestro código:

En este caso, hemos realizado una petición POST a través de Alamofire.

 

Configurando las cabeceras de la petición

 

Puede que además del método queramos configurar las cabeceras de la petición. Esto podríamos hacerlo así:

En este caso estamos especificando que el User-Agent de nuestra cabecera es xxx.

 

Petición con parámetros en Alamofire

 

Hemos visto como realizar una petición sencilla desde Alamofire. Pero todas las peticiones que vamos a realizar no van a ser tan simples.

En muchas ocasiones vamos a tener que pasar una serie de parámetros al servidor.

Estos parámetros que vamos a enviar pueden ir en diferentes lugares dentro de nuestra petición.

Los 2 sitios más comunes son:

  • Agregar los parámetros a la URL de la petición
  • Agregar los parámetros al body de la petición

Nosotros especificaremos donde queremos que vayan a través del objeto encoding.

Si queremos que vayan en la URL, usaremos URLEncoding.default:

Las parejas clave:valor que pasemos aquí se concatenarán a la URL.

Si por ejemplo, quisiéramos realizar una petición GET a la url www.example.com y pasarle estos 2 parámetros: param1 = 7 y param2 = 2 en la propia URL, haríamos lo siguiente:

Y a través de esta request, generaríamos una petición HTTP como esta:

Si por el contrario, queremos pasar los parámetros en el body de la petición, usaríamos URLEncoding.httpBody:

Si te das cuenta hemos añadido, que la petición se trata de un POST.

¿Por qué?

Por esto:

 

No podemos realizar una petición GET con parámetros en el body porque el GET no soporta body. Si queremos pasar los parámetros en el body deberemos usar otro verbo que no sea GET, por ejemplo POST

 

Bonus: Enviando JSON en el body de la petición

 

Como apartado final, veamos como podríamos enviar un texto en formato json en el body de nuestra petición. Haríamos lo siguiente:

Como ves, hemos utilizado JSONEncoding.default.

Esto es algo muy útil que suele utilizarse bastante.

Con esto que acabamos de ver, estás preparado para trabajar con Alamofire. En la segunda parte del tutorial veremos como poner en práctica todos estos conceptos para desarrollar una aplicación iOS.

 

8. Resumen final

 

Espero que este tutorial te haya servido para asentar tus conocimientos sobre Alamofire. Por ahora solo hemos visto la parte teórica, pero todo esto nos servirá para tener una buena base a la hora de desarrollar la aplicación iOS usando Alamofire, en la segunda parte del tutorial.

Aquí tienes un pequeño resumen de los puntos más importantes que hemos visto:

  1. ¿Qué opciones tenemos para realizar peticiones a servidor en Desarrollo iOS?
  2. ¿Cuales son y en que consisten los verbos HTTP?
  3. Breve introducción a JSON
  4. Como realizar peticiones simples con Alamofire
  5. Serializando las respuestas con Alamofire
  6. Configurando el verbo de la petición
  7. Configurar las cabeceras de la petición
  8. Como realizar peticiones con parámetros con Alamofire
  9. Como podemos enviar JSON en el body de la petición

 

9. Has terminado el Tutorial

 

Has acabado la primera parte del tutorial de esta semana en EfectoApple. Como siempre, aquí tienes tu recompensa en forma de video:

 

 

10. ¿Donde ir ahora?

 

Dentro de muy poco publicaré la segunda parte de este tutorial, donde pondremos en práctica lo que hemos visto y desarrollaremos una app que solicitará datos al servidor.

Además te mostraré una herramienta muy sencilla que te ayudará a mockear tus propios servicios web.

Si no quieres perderte ningún tutorial de EfectoApple, puedes suscribirte a nuestra newsletter, a través del formulario que tienes al final de este post.

Puedes acceder a más tutoriales disponibles en EfectoApple, desde aquí.

Si este artículo te ha parecido útil, me harías un gran favor compartiéndolo en tus redes sociales.

Y como siempre, para cualquier duda, tienes los comentarios a tu disposición.

 

Etiquetas:
2 Comentarios
  • carlos
    Publicado a las 16:24h, 13 julio Responder

    Luis Capo!!, gracias por tu aporte, yo de igual forma que vos, pero del otro lado del mundo (dese Argentina) luego de 15 años de mi propia empresa de servicios de electricidad, sentí la necesidad de un cambio y decidí estudiar ingeniería en sistema, si bien aprendi muchísimo en la facultad, el aprendizaje en la misma no fue especifico en el desarrollo mobile el cual tengo que aprender de forma autodidacta y tu sitio me es de gran utilidad ya que en Android existe mucha información pero no es el caso de IOs.
    Nuevamente gracias por tu aporte!!

    • Luis R
      Publicado a las 19:39h, 13 julio Responder

      Un placer Carlos!
      Me alegro que los tutoriales te sean de utilidad!

Escribe un comentario

10AppsIpad

Descarga las 10 Aplicaciones

Introduce tu Nombre y tu Email para recibir las Apps en tu Correo

Acabo de enviarte un email. Sigue las instrucciones para descargar las Aplicaciones. Puede que tengas que revisar tu buzón de correo no deseado. Gracias.