Cuando trabajamos con Javascript lo normal es que si queremos obtener datos desde un servidor debemos hacer peticiones vía Ajax esto nos hace tener que manipular los diferentes métodos HTTP para poder tener las respuestas adecuadas desde el servidor.
AngularJS no es diferente en este enfoque y por lo tanto necesita hacer peticiones a servidores vía HTTP para poder obtener la información con la cual poder llenar los modelos de datos, esto es la base de cualquier aplicación.
En la antigüedad teníamos que manipular de forma directa el objeto XMLHttpRequest dentro de nuestros documentos con Javascript de forma que pudiéramos poder obtener los datos y enviar las diferentes peticiones, esto resultaba en código extremadamente largo, repetitivo y poco legible, para una muestra veamos un esquema de petición estándar de épocas pasadas:
Como vemos primero debíamos definir cómo manejar la respuesta a la petición, estableciendo los métodos estándar y también debíamos manejar los errores de forma manual, finalmente abríamos la conexión al servidor y enviábamos los datos. Esto en su momento fue algo revolucionario, sin embargo lo engorroso de su aplicación hizo que se llevara a cabo una modernización de todo esto.
Ahora nos movemos unos 10 años hacia adelante y tenemos a AngularJS quien nos simplifica la forma en la que nos comunicamos con los servidores vía HTTP, para ello contamos con la interfaz XHR que nos permite hacer llamadas asíncronas a los diferentes servidores y con los diferentes métodos HTTP, esto hace que la implementación anterior se vea simplificada y nos facilite el desarrollo como podemos notar en el siguiente ejemplo:
Aquí vemos como con el método get() llamado con la variable $http, podemos invocar a una ruta de un servidor y además pasar parámetros de forma sencilla, luego si tenemos una respuesta de éxito podremos ejecutar alguna acción y en caso de tener una respuesta de error podemos ejecutar otra diferente.
En el ejemplo anterior apenas vimos cómo hacer una petición vía GET, sin embargo podemos utilizar todos los métodos disponibles en HTTP, veamos los que tenemos disponibles:
Vemos cómo podemos pasar variables que contengan diferentes datos dentro de la petición y utilizamos el método post() en este caso para hacer referencia al método HTTP deseado.
Con esto finalizamos este tutorial, hemos visto cómo podemos manejar los diferentes métodos en AngularJS y la mejora que se ha vivido a lo largo de los años respecto a formas anteriores de lograr la comunicación vía HTTP con los servidores.
AngularJS no es diferente en este enfoque y por lo tanto necesita hacer peticiones a servidores vía HTTP para poder obtener la información con la cual poder llenar los modelos de datos, esto es la base de cualquier aplicación.
La petición
En la antigüedad teníamos que manipular de forma directa el objeto XMLHttpRequest dentro de nuestros documentos con Javascript de forma que pudiéramos poder obtener los datos y enviar las diferentes peticiones, esto resultaba en código extremadamente largo, repetitivo y poco legible, para una muestra veamos un esquema de petición estándar de épocas pasadas:
Como vemos primero debíamos definir cómo manejar la respuesta a la petición, estableciendo los métodos estándar y también debíamos manejar los errores de forma manual, finalmente abríamos la conexión al servidor y enviábamos los datos. Esto en su momento fue algo revolucionario, sin embargo lo engorroso de su aplicación hizo que se llevara a cabo una modernización de todo esto.
Ahora nos movemos unos 10 años hacia adelante y tenemos a AngularJS quien nos simplifica la forma en la que nos comunicamos con los servidores vía HTTP, para ello contamos con la interfaz XHR que nos permite hacer llamadas asíncronas a los diferentes servidores y con los diferentes métodos HTTP, esto hace que la implementación anterior se vea simplificada y nos facilite el desarrollo como podemos notar en el siguiente ejemplo:
Aquí vemos como con el método get() llamado con la variable $http, podemos invocar a una ruta de un servidor y además pasar parámetros de forma sencilla, luego si tenemos una respuesta de éxito podremos ejecutar alguna acción y en caso de tener una respuesta de error podemos ejecutar otra diferente.
Comparación
Si comparamos las formas entre lo antiguo y lo que se ha logrado con AngularJS, vemos que no hay puntos apenas en común más que la funcionalidad, por supuesto la forma vieja es lo que dio paso a todo lo que podemos tener en nuestros días para poder hacer un desarrollo más rápido y menos confuso.
Otros métodos HTTP
En el ejemplo anterior apenas vimos cómo hacer una petición vía GET, sin embargo podemos utilizar todos los métodos disponibles en HTTP, veamos los que tenemos disponibles:
- GET
- HEAD
- POST
- DELETE
- PUT
- JSONP
Vemos cómo podemos pasar variables que contengan diferentes datos dentro de la petición y utilizamos el método post() en este caso para hacer referencia al método HTTP deseado.
Con esto finalizamos este tutorial, hemos visto cómo podemos manejar los diferentes métodos en AngularJS y la mejora que se ha vivido a lo largo de los años respecto a formas anteriores de lograr la comunicación vía HTTP con los servidores.
