External APIs: Paging

Hey there! In this guide, we'll explore how to work with external APIs that have pagination or limits and offsets using Xano. Have you ever encountered an API that returns data in chunks, and you need to continuously call it to retrieve all the data? Well, you're in luck because Xano makes this task a breeze!

Understanding the PokeAPI Example

To illustrate this process, we'll be using the PokeAPI, a handy API that provides information about different Pokemon. If you visit PokeAPI.co, you'll see a "Try it out" section where you can fetch a list of Pokemon.

The API has parameters like limit and offset that control how many Pokemon are returned and where to start in the list, respectively. For example, setting limit=100 and offset=200 will return 100 Pokemon starting from the 201st entry.

Step 1: Create a Variable for the API Response

First, let's copy the API URL into Xano and run it. You'll notice that the response includes various details like the request headers, response headers, and the actual Pokemon data.

To work with the data more easily, create a new variable using the "Sub Path" feature. This allows you to drill down and select the specific data you want to work with.

1. Copy the API response as JSON.
2. Create a new variable called results using the "Sub Path" feature.
3. Navigate to the desired data path (e.g., result.results) and select it.

Step 2: Set Up Pagination Variables

Next, we'll create variables to control the pagination process. Since we want to fetch the last 118 Pokemon, we'll set the initial offset to 1000 and the limit to 2 (for demonstration purposes).

1. Create a new variable called offset and set its value to 1000.
2. Create a new variable called limit and set its value to 2.

Step 3: Update the API Call with Pagination Parameters

Now, we'll update the API call to include the limit and offset parameters using the variables we just created.

1. In the API call, locate the "Params" section.
2. Add a new parameter called limit with the value set to the limit variable.
3. Add another parameter called offset with the value set to the offset variable.

Step 4: Accumulate Data with a While Loop

To gather all the Pokemon data from the paginated API, we'll use a while loop. This loop will continue iterating until we've retrieved all the data.

1. Create a new while loop with the condition set to true.
2. Inside the loop, add a conditional statement that checks if results.next is equal to null. If it is, break out of the loop using break.
3. After the conditional statement, update the offset variable by adding the current limit value to it.
4. Create a new variable called listOfNames and initialize it as an empty array.
5. Inside the loop, update the listOfNames variable by merging it with the results.results.name values from the API response.

Step 5: Run and Customize

Now you're ready to run the script and see the accumulated list of Pokemon names! If you want to fetch a different range of Pokemon, adjust the initial offset value and the condition in the conditional statement.

For example, to fetch the first 25 Pokemon, set the initial offset to 0, and change the conditional statement to break the loop when offset is greater than or equal to 25.

And there you have it! You've successfully learned how to work with paginated APIs in Xano. This technique can be applied to various APIs, allowing you to gather data efficiently and seamlessly.

Feel free to experiment and adapt the code to suit your specific needs. Happy coding!