Skip to content

Combining data with multiple fetch requests

 Published on 25th July 2023

I was recently working on a project where I needed to make multiple API calls to create a combined array of data. It is very easy to get into a mess with a task like this. For those that find themselves in a similar position, the solution I went with looks like this:

const fetchData = async (urls) => {
const data = await Promise.all(urls.map((url) => fetch(url));
const combinedData = await Promise.all(data.map(async (res) => {
if (!res.ok) {
// Return whatever you want/need this to be
return [];
}

const result = await res.json();

return result;
}));

// Then do whatever you need to with combinedData
}