How to implement pagination for getting NFTs from moralis

Hi, guys
Hope you are doing well.
Currently I use Web3 API for getting NFTs.
I want to show only 10 NFTs per page, exactly want to implement pagination.
But there is a problem for implementing this.
For this, I call this request to moralis.

https://deep-index.moralis.io/api/v2/nft/{nft_ddress}?chain=bsc&format=decimal&limit=${limit}&offset=${offset}&order=desc

limit: number of NFTs that I want to show per page (ex: 10)
offset = page_number * limit

It worked well but it has a problem when there are more than 500 NFTs.
Please let me know how I can resolve this problem.

Hi,

You can try to use cursor instead of offset.
You have an example here: https://docs.moralis.io/misc/rate-limit#example-of-how-to-use-cursor-python

Hi cryptokid.
Thank you so much for your reply.
I know the information that you’ve mentioned.
Currently I’m building React app using Web3.js.
I call the api in front-end(React).
Could you tell me how can I use cursor instead of offset for implementing pagination.
Thanks a lot.

here is an example of how to do it with javascript in nodejs:
https://docs.moralis.io/misc/rate-limit#example-of-how-to-use-cursor-nodejs

Hi cryptokid.
Thank you so much for your reply.
I tried to use the codes that you’ve mentioned.
But I can’t implement pagination exactly.
It shows all NFTs but I don’t want that.
I also used this example.

Let me explain in more details.
If I want to show only 10 NFTs per page.
So if there are 1000 NFTs, there will be 100 pages.
If I want to show from 800th to 810th NFTs, the request url should be as follow.
https://deep-index.moralis.io/api/v2/nft/{nft_ddress}?chain=bsc&format=decimal&limit=10&offset=800&order=desc

But it doesn’t work.
Could you help me?
This is very urgent problem for me.

@ken-yoshida to do this, you would have to expect ordered results. But it seems from what has been discussed in this discussion that the web3 API no longer supports the parameter order, nor offset for that matter.

In this case, you can order your query using the method I mentioned here. But still, this method only order the 500 NFTs in the current page, and they can range from 1 to any possible ID inside a given collection.

If you want more freedom manipulating your query results, the best you can do is fetch for all NFTs in that particular collection (you will need to use cursors for that), order it on your side, then use your logic to read the specific range you want.

Hi @menezesphill
Thank you so much for your information.
I wonder if it will be more slow when I use my own logic to implement pagination.

Waiting for several API calls to get the complete data will slow you down the most. So, the bigger your NFT collection is, the slower it gets. The ideal is to fetch the data only once and store the data locally somehow.

Hi @menezesphill
Thank you so much.
I appreciate your help.