JavaScript Básico

Inicio / Tema / JavaScript Básico / Trabajando con APIs

Trabajando con APIs

Las APIs (Application Programming Interfaces) permiten que diferentes aplicaciones se comuniquen entre sí. En el desarrollo web, las APIs son fundamentales para intercambiar datos entre el cliente y el servidor o entre diferentes servicios. En este capítulo, aprenderás cómo trabajar con APIs usando JavaScript, especialmente cómo realizar peticiones HTTP para obtener datos y cómo procesar las respuestas.

¿Qué es una API?

Una API es un conjunto de reglas y protocolos que permiten que diferentes aplicaciones se comuniquen entre sí. En el contexto del desarrollo web, las APIs suelen proporcionar una forma estructurada de acceder a los datos de un servidor a través de peticiones HTTP. Por ejemplo, podrías utilizar una API para obtener los datos del clima, acceder a una base de datos de usuarios, o enviar datos a un servidor.

Peticiones HTTP

Las peticiones HTTP son la base de la comunicación con una API en la web. Los métodos HTTP más comunes que utilizarás son:

GET: Para obtener datos del servidor.
POST: Para enviar datos al servidor.
PUT: Para actualizar datos en el servidor.
DELETE: Para eliminar datos del servidor.

Ejemplo básico de una petición GET

Puedes hacer peticiones HTTP en JavaScript utilizando la API fetch, que es nativa en los navegadores modernos.

javascript

"En este ejemplo, utilizamos la función fetch para hacer una petición GET a una API. La respuesta de la API se convierte a formato JSON usando el método response.json. Luego, los datos se imprimen en la consola. Si ocurre un error, se captura en el bloque catch y se muestra en la consola."

Ejemplo básico de una petición POST

Una petición POST se utiliza cuando necesitas enviar datos al servidor, como los detalles de un nuevo usuario o una nueva publicación en un blog. Con fetch, puedes realizar una petición POST de la siguiente manera:

javascript

"En este ejemplo, realizamos una petición POST a una API para crear un nuevo usuario. Utilizamos el método POST, definimos los encabezados para especificar que estamos enviando datos JSON, y en el cuerpo de la petición, pasamos los datos del nuevo usuario. La respuesta del servidor se maneja de la misma manera que en la petición GET."

Manejo de Respuestas y Errores

Cuando haces una petición HTTP, es importante manejar tanto las respuestas exitosas como los posibles errores. Además de los errores de red, las APIs pueden devolver códigos de estado HTTP que indican si la petición fue exitosa o no.

Manejo de Códigos de Estado HTTP

Los códigos de estado HTTP son útiles para determinar si la petición fue exitosa. Por ejemplo:

200: La petición fue exitosa.
201: Recurso creado exitosamente (para POST).
400: Petición inválida.
404: Recurso no encontrado.
500: Error del servidor.

Puedes verificar el código de estado en la respuesta antes de procesar los datos.

javascript

"En este ejemplo, verificamos si la respuesta tiene un código de estado de éxito utilizando response.ok. Si la petición no fue exitosa, lanzamos un error con el código de estado. De lo contrario, procesamos los datos como de costumbre."

Autenticación en APIs

Algunas APIs requieren autenticación para asegurarse de que solo usuarios autorizados puedan acceder a los datos. Esto se logra mediante tokens de autenticación, que se envían en los encabezados de las peticiones.

Autenticación con Tokens

Un token de autenticación suele proporcionarse después de que un usuario se autentica en un sistema y debe enviarse en los encabezados de cada petición subsecuente.

javascript

"Aquí estamos enviando un token de autenticación en el encabezado de una petición GET. El encabezado Authorization incluye la palabra Bearer seguida del token. Este enfoque es común cuando trabajas con APIs que requieren autenticación."

APIs Públicas y Privadas

Existen dos tipos principales de APIs:

APIs Públicas: Son accesibles para cualquier usuario sin restricciones. Ejemplos incluyen APIs de clima o noticias.
APIs Privadas: Requieren autenticación y solo permiten el acceso a usuarios o aplicaciones autorizadas. Estas son comunes en aplicaciones internas o servicios que manejan datos sensibles.

Ejemplo de una API Pública

javascript

"En este ejemplo, hacemos una petición GET a la API pública de Coindesk para obtener el precio actual del Bitcoin. Luego imprimimos el precio en dólares estadounidenses en la consola."

APIs REST vs. GraphQL

En el mundo de las APIs, existen diferentes estilos arquitectónicos. El más común es REST, que organiza los recursos en URLs y utiliza los métodos HTTP para interactuar con ellos. Sin embargo, también existe GraphQL, que permite a los clientes especificar exactamente qué datos quieren en una única petición.

Diferencias clave entre REST y GraphQL

REST: Cada recurso tiene su propio endpoint. Necesitas hacer múltiples peticiones para obtener datos relacionados.
GraphQL: Todo está centralizado en un único endpoint, y el cliente especifica exactamente qué datos necesita en una sola consulta.

Aunque REST sigue siendo la opción más común, GraphQL está ganando popularidad debido a su flexibilidad y eficiencia al manejar datos complejos.

Conclusión

Trabajar con APIs es una habilidad esencial para cualquier desarrollador web moderno. En este capítulo, has aprendido cómo hacer peticiones HTTP con JavaScript utilizando fetch, manejar respuestas y errores, y cómo trabajar con APIs que requieren autenticación.

Volver al capítulo anterior

Marcar como leìdo y continuar

Pregúntame lo que sea