Vue.js cómo realizar solicitudes GET y POST cada 5 minutos con Axios.
Estoy tratando de hacer una solicitud GET de Axios que se llame cada 5 minutos. En mi .then de la solicitud GET de Axios analizo los datos y luego los envío por POST en una solicitud anidada de Axios. Sin embargo, la solicitud POST se activa antes de que se cumpla el tiempo de 5 minutos. He probado tenerlos como dos setInterval separados, pero eso tampoco ha funcionado para mí. ¿Alguien tiene alguna sugerencia y sabe por qué se está activando el POST antes de que se cumplan los 5 minutos?
setInterval(() => {
let uri = 'https://prices.runescape.wiki/api/v1/osrs/5m';
axios.get(uri).then(response => {
console.log(response.data);
this.prices = response.data.data;
this.timestamp = response.data.timestamp;
for(const index in this.prices){
this.fiveMinPrice = {
"id": index,
"avgHighPrice": this.prices[index].avgHighPrice,
"avgLowPrice": this.prices[index].avgLowPrice,
"highPriceVolume": this.prices[index].highPriceVolume,
"lowPriceVolume": this.prices[index].lowPriceVolume,
"timestamp": this.timestamp
};
this.fiveMinPrices.push(this.fiveMinPrice);
}
let url = '/api/5m/';
axios.post(url, this.fiveMinPrices).then(response => {
console.log(response);
}).catch(function(error){
console.log(error);
});
}).catch(function(error){
console.log(error);
});
this.fiveMinPrices = [];
this.prices = [];
this.fiveMinPrice = {};
this.timestamp = 0;
}, 300000);
davy.ai
El problema es que la función
setInterval
ejecuta el bloque de código cada 5 minutos, pero la solicitudPOST
anidada de Axios es asíncrona y puede llevar algún tiempo en completarse. Esto significa que la solicitudPOST
puede no haberse completado antes de que se active el siguiente intervalo, lo que provoca que la solicitudPOST
se envíe antes de lo planeado.Una posible solución es utilizar
setTimeout
en lugar desetInterval
y realizar la solicitudPOST
anidada de Axios dentro del bloquethen
de la primera solicitudGET
de Axios, después de que los datos hayan sido procesados. Esto asegura que la solicitudPOST
solo se haga después de que la solicitud anterior se haya completado con éxito.Aquí tienes un ejemplo de fragmento de código:
En este ejemplo, se llama a la función
fetchData()
cada 5 minutos utilizandosetTimeout
. Dentro de esta función, se realiza la solicitudGET
de Axios para obtener los datos. Una vez que se obtienen y procesan los datos, se realiza la solicitudPOST
, seguida de una nueva llamada asetTimeout
para continuar con el ciclo.Al utilizar
setTimeout
en lugar desetInterval
, nos aseguramos de que la solicitudPOST
solo se realice después de que la solicitud anterior se haya completado con éxito, sin importar cuánto tiempo tome.