How run multiple fetch requests simultaneously
May 15, 2024
With Promise.all() you can make multiple fetch requests simultaneously.
const INVESTMENTS_API = 'https://api.example.com/investments'
const BILLS_API = 'https://api.example.com/bills'
const fetchData = async (url: string) => {
const response = await fetch(url)
return response.json()
}
const getData = async () => {
try {
// Start fetching both URLs simultaneously using Promise.all()
const [investments, bills] = await Promise.all([
fetchData(INVESTMENTS_API),
fetchData(BILLS_API)
])
console.log('investments:', investments)
console.log('bills:', bills)
} catch (error) {
console.error('Error fetching data:', error)
}
}
void getData()
The data from the requests is then available in the order they were passed to Promise.all(), which we can then process further as needed.