JAVASCRIPT
Consuming a Paginated API (Fetch All Pages)
Learn how to iteratively fetch all data from an API that implements cursor-based or offset-based pagination, ensuring complete data retrieval.
async function fetchAllPaginatedData(baseUrl, params = {}, limit = 100) {
let allItems = [];
let currentPage = 1;
let hasMore = true;
while (hasMore) {
const urlParams = new URLSearchParams({
...params,
page: currentPage,
limit: limit
});
const url = `${baseUrl}?${urlParams.toString()}`;
try {
const response = await fetch(url);
if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}
const data = await response.json();
// Assuming API returns data in a 'items' or 'data' array and 'has_more' flag
const items = data.items || data.data || []; // Adjust based on your API response structure
allItems = allItems.concat(items);
// Assuming API provides a 'has_more' boolean or checks if items array is empty
hasMore = (data.has_more === true) || (items.length === limit && data.total_pages && currentPage < data.total_pages);
// Or simply: hasMore = items.length === limit; if no explicit 'has_more' flag and limit implies more
currentPage++;
// Add a small delay to avoid hitting rate limits too quickly
if (hasMore) {
await new Promise(resolve => setTimeout(resolve, 50));
}
} catch (error) {
console.error('Error fetching paginated data:', error);
break; // Exit loop on error
}
}
return allItems;
}
// Example usage:
// (async () => {
// const products = await fetchAllPaginatedData('https://api.example.com/products', { category: 'electronics' }, 50);
// console.log(`Fetched ${products.length} products:`, products);
// })();
How it works: This JavaScript function `fetchAllPaginatedData` demonstrates how to consume a paginated API to retrieve all available data. It uses an `async/await` loop to make sequential requests, incrementing the page number (or handling cursors if the API uses them) until no more data is available. It concatenates items from each page into a single array and includes basic error handling, making it a robust solution for collecting extensive datasets from APIs.