Me sale un error que no entiendo. Obtengo una URL de API en formato json, seguida de un análisis de objetos json a JS, usando json()
const response = fetch('https://power.larc.nasa.gov/api/temporal/monthly/point?parameters=ALLSKY_SFC_SW_DNI&community=RE&longitude=48.0000&latitude=27.0000&format=JSON&start=2001&end=2020'); const data = response.json();¿Alguien puede explicar este error?
fetch es una función asíncrona ; no devuelve la respuesta de inmediato (en su lugar, obtiene una Promise ).
Si desea recuperar los datos, debe usar await (si se llama a la recuperación dentro de otra función async ), o proporcionar una devolución de llamada a través del método then en la Promise de la llamada de fetch :
fetch('https://power.larc.nasa.gov/api/temporal/monthly/point?parameters=ALLSKY_SFC_SW_DNI&community=RE&longitude=48.0000&latitude=27.0000&format=JSON&start=2001&end=2020') .then(response => { const data = response.json(); });Si hicieras algo como esto, no funcionará:
let data; fetch('https://power.larc.nasa.gov/api/temporal/monthly/point?parameters=ALLSKY_SFC_SW_DNI&community=RE&longitude=48.0000&latitude=27.0000&format=JSON&start=2001&end=2020') .then(response => { data = response.json(); }); console.log(data); El motivo es que la devolución de llamada dentro del método then se ejecuta después de que se haya devuelto la respuesta (esto puede tardar unos segundos, por ejemplo), pero console.log(data) se ejecuta inmediatamente después de que se llama a fetch . Esto significa que los datos aún no están asignados y probablemente no estarán undefined . Por esta razón, si desea colocar data en algún lugar, debe colocar su código dentro de la devolución de llamada .
function processData(responseData) { // Here, you can put your code to process the data from response console.log(responseData); } fetch('https://power.larc.nasa.gov/api/temporal/monthly/point?parameters=ALLSKY_SFC_SW_DNI&community=RE&longitude=48.0000&latitude=27.0000&format=JSON&start=2001&end=2020') .then(response => { const data = response.json(); processData(data); }); De esta manera, los data se procesarán después de que se obtengan.
Fetch devuelve una Promesa ya que está enviando una solicitud a una API. Este tipo de funciones es asynchronous ya que no sabemos cuándo estamos recibiendo la respuesta de la API.
Puede usar async/ await o .then() y .catch() para ejecutar su código cuando reciba la respuesta.
Prueba esto:
let returnedData; fetch('https://power.larc.nasa.gov/api/temporal/monthly/point?parameters=ALLSKY_SFC_SW_DNI&community=RE&longitude=48.0000&latitude=27.0000&format=JSON&start=2001&end=2020') .then((data) => { console.log(data) returnedData = data }) .catch((error) => { console.log(error) })