Trabajando con API en JavaScript
Trabajar con APIs en JavaScript implica realizar solicitudes HTTP para obtener o enviar datos a servicios externos. Esto se hace comúnmente utilizando la API Fetch, que es una API basada en promesas para realizar solicitudes HTTP. A continuación, se presentan ejemplos de cómo realizar solicitudes GET y POST, y cómo manejar respuestas y errores.
Ejemplo de Solicitud GET con Fetch
Para obtener datos de una API, como el clima de una ciudad utilizando la API de OpenWeatherMap, puedes hacer lo siguiente:
const apiKey = "tu_api_key_de_openweathermap";const apiUrl = `https://api.openweathermap.org/data/2.5/weather?q=London&appid=${apiKey}`;
fetch(apiUrl) .then((response) => { if (!response.ok) { throw new Error("La respuesta de la red no fue correcta"); } return response.json(); }) .then((data) => { const temperature = data.main.temp; const description = data.weather[1].description; const location = data.name; console.log(`Temperatura en ${location}: ${temperature}°C`); console.log(`Clima: ${description}`); }) .catch((error) => { console.error("Error:", error); });Ejemplo de Solicitud POST con Fetch
Para enviar datos a una API, como enviar datos de un formulario a un servidor, puedes hacer lo siguiente:
const apiUrl = "https://api.example.com/data";const data = { name: "John Doe", email: "john.doe@example.com" };
fetch(apiUrl, { method: "POST", headers: { "Content-Type": "application/json", }, body: JSON.stringify(data),}) .then((response) => response.json()) .then((data) => console.log("Success:", data)) .catch((error) => console.error("Error:", error));Manejo de Respuestas y Errores
Es importante manejar adecuadamente las respuestas y los errores al trabajar con APIs. Puedes verificar si la respuesta fue exitosa utilizando response.ok y
manejar los errores con .catch().
Trabajando con Claves de API
Muchas APIs requieren autenticación mediante claves de API. Asegúrate de incluir tu clave de API en las solicitudes apropiadas, generalmente en los encabezados de la solicitud.
const apiKey = "tu_api_key_aqui";const apiUrl = "https://api.example.com/data";
const requestOptions = { method: "GET", headers: { Authorization: `Bearer ${apiKey}`, },};
fetch(apiUrl, requestOptions) .then((response) => { if (!response.ok) { throw new Error("La respuesta de la red no fue correcta"); } return response.json(); }) .then((data) => console.log(data)) .catch((error) => console.error("Error:", error));Estos ejemplos demuestran cómo realizar solicitudes básicas a APIs utilizando JavaScript y la API Fetch. Recuerda siempre revisar la documentación de la API específica con la que estás trabajando para entender sus requisitos y limitaciones.