I have a array of objects in a current react state, I want to iterate through each object in the array and grab an idea in order to make a request for each object and grab inforamtion from the api to complete the missing data in the object.
When i run the command, I am getting a 429 error that means to many request are being sent before they have time to process. I tried to use a timer but that did not work. I also tried to use useEffect but i was running into the same issue. I resorted to going back to original idea which was a for loop but it is breaking everything.
code:
function buildCompleteProperties(){
for(let i = 0; i < propertyList.length; i++){
propertyOptions['params'] = {zpid: propertyList[i]['zpid']}
axios.request(propertyOptions).then(function (response) {
console.log(response.data);
}).catch(function (error) {
console.error(error);
});
}
}
At the end, it shows the first property details from the requests. here is waht the console looks like:
VM7363:1 GET https://zillow-com1.p.rapidapi.com/property?zpid=20471276 429 (Too Many Requests)
Error: Request failed with status code 429
at createError (createError.js:16)
at settle (settle.js:17)
at XMLHttpRequest.onloadend (xhr.js:66)
VM7363:1 GET https://zillow-com1.p.rapidapi.com/property?zpid=20471276 429 (Too Many Requests)
Error: Request failed with status code 429
at createError (createError.js:16)
at settle (settle.js:17)
at XMLHttpRequest.onloadend (xhr.js:66)
VM7363:1 GET https://zillow-com1.p.rapidapi.com/property?zpid=20471276 429 (Too Many Requests)
Error: Request failed with status code 429
at createError (createError.js:16)
at settle (settle.js:17)
at XMLHttpRequest.onloadend (xhr.js:66)
VM7363:1 GET https://zillow-com1.p.rapidapi.com/property?zpid=20471276 429 (Too Many Requests)
Error: Request failed with status code 429
at createError (createError.js:16)
at settle (settle.js:17)
at XMLHttpRequest.onloadend (xhr.js:66)
listingProvider: {…}, buildingPermits: null, propertyTaxRate: 0.77, contact_recipients: Array(1), solarPotential: {…}, …}
address:
The most straightforward approach would be to briefly pause after each call. You can achieve this by making your function asynchronous, and assigning axios.request() to a variable using await (rather than using the .then() syntax afterward). Set the sleep timer to whatever value is needed to stay within the API limitations.
Here is how I would refactor it:
function sleep(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
async function buildCompleteProperties(){
for(let property of propertyList){
propertyOptions.params = {
zpid: property.zpid
}
try {
let { data } = await axios.request(propertyOptions);
console.log(data)
await sleep(1000)
} catch (error){
console.error(error);
}
}
}
When the call is done, fire off the next one.
function makeRequests() {
let i = 0;
function next() {
propertyOptions['params'] = {
zpid: propertyList[i]['zpid']
};
axios.request(propertyOptions).then(function (response) {
console.log(response.data);
i++;
if (propertyList.length < i) next();
});
}
next();
}