Data Loading
Unanswered
Trevor posted this in #help-forum
TrevorOP
So I’m a bit new to this and trying to figure out more of the proper approach for this.
One of my pages loads a lot of data, so I’m looking into doing the infinite scrolling. For this, would I have to have the client side send an API request on the server? Whats the typical approach for something like this?
I am using NextJS and Supabase
I can give more information if needed, this just sums it up.
One of my pages loads a lot of data, so I’m looking into doing the infinite scrolling. For this, would I have to have the client side send an API request on the server? Whats the typical approach for something like this?
I am using NextJS and Supabase
I can give more information if needed, this just sums it up.
21 Replies
TrevorOP
I would like to have it load on the server side, but I’m curious to see how other people have handled this. Probably the easier route would be a better approach for me
I would also be looking to add filters here soon, so that may play a role in this also
TrevorOP
@"use php"
use
IntersectionObserverApiOnce it is, send an api request to get additional content
TrevorOP
@"use php" If I have it call an API, it will show up in my networks tab. Is it possible to block users from directly accessing the API?
Currently only an authorized user can get the data, but is it possible to block direct interaction with the API?
And no way, there’s no way to block. You can add authentication to it to restrict only some users to access or
Or maybe rate limit
TrevorOP
@"use php" I’ve just wondered how to add some security to it. So even if it is an authorized user, I just don’t want a user to directly call the API like in the browser. Would CORS do this?
TrevorOP
Would you recommend using like Supabase Realtime, maybe WebSockets, or what about prefetching?
@Trevor I actually have infinite scroll on one of my sites, one sec
https://github.com/Arinji2/news-nest/blob/main/app%2F%28articles%29%2Flive%2Fcontents.tsx
This is the client part where I use intersection observer to make a request to a server action
https://github.com/Arinji2/news-nest/blob/main/app%2F%28articles%29%2FgetNext.ts
Server action
This is the client part where I use intersection observer to make a request to a server action
https://github.com/Arinji2/news-nest/blob/main/app%2F%28articles%29%2FgetNext.ts
Server action
TrevorOP
@Arinji Thanks for the response. So it looks like this uses a filter also? Does this use websockets to load the data as the user scrolls?
TrevorOP
I downloaded your project and ran it, it is exacty what I am trying to do! Thanks!
@Trevor I downloaded your project and ran it, it is exacty what I am trying to do! Thanks!
Tf it works? I didn't explain how any of the env vars work lol
is your issue resolved? lmk if you've any additional queries
TrevorOP
@"use php" It’s all good, thanks for your response
Mark the message which solved your issue as solution