Fetching data in server side every minute
Answered
Common paper wasp posted this in #help-forum
Common paper waspOP
Let say I get data statically in a page:
So when user enters the website, the data is already prebuilt. But now I want to this exact data every minute while user is at the page.
Is it possible to do it in server?
export default async function Home() {
const data = await getLatestPrices();
console.log(data);
return <div>{data}</div>;
}So when user enters the website, the data is already prebuilt. But now I want to this exact data every minute while user is at the page.
Is it possible to do it in server?
Answered by B33fb0n3
yes, you can create a route handler or server action. To have less redundancy you can create one server action inside a separate file. This function can be called inside your server component and from the client itself. When calling it from a server component it's a normal function. When calling it from client it's a server action (so a function that is executed on the server)
20 Replies
yes, you can do this by adding
to your page
export const revalidate = 60 // 60 secondsto your page
Common paper waspOP
Yeah im aware of ISR. but im talking about revalidating the data when user is on the page and show the change realtime
nextjs is build as serverless functions. So if you want realtime updates you need the client to do this.
You can do this by using a clientside fetching library like SWR or react query. When configuring it correctly it will refetch the data every minute and change the page perfectly
You can do this by using a clientside fetching library like SWR or react query. When configuring it correctly it will refetch the data every minute and change the page perfectly
Common paper waspOP
Ok thank you. So I have to create an api route handler and call that for client side usage? Because the
getLatestPrices() function has some private thingies that should not be in client. But If I have to have both an api router handler and a "service" file that uses this, and a function that can be used directly in server, wouldnt it be redundant?yes, you can create a route handler or server action. To have less redundancy you can create one server action inside a separate file. This function can be called inside your server component and from the client itself. When calling it from a server component it's a normal function. When calling it from client it's a server action (so a function that is executed on the server)
Answer
Common paper waspOP
oh server actions can be used safely in client?
yes, they are made for mutating data from the client, serverside. It has some disadvantages compared to route handlers however that are not relevant here
Common paper waspOP
Thank you ❤️
happy to help
Common paper waspOP
One more question even tho not related,
Any opinion on where to put/how to structure server actions in project?
Any opinion on where to put/how to structure server actions in project?
I like to create one file for the route that uses that action
Holland Lop
If there is no revalidate added explicitly, is there any default revalidation interval exist?
when no default revalidation is set, then there won't be a default revalidation. Based on the route itself (dynamic/static) it will be rendered
Holland Lop
Here you meant by route is API route?
My scenario is like I'm trying to list out online users in a page(/online). Where the /online is server component(non 'use client'). External API endpoint is used to get online users using Axios. I was only getting the users active at the time of initial page load and the list was not updating even if I hit refresh page several times. Then I added revalidation in the server component, all works fine.
I would like to know what had actually happened. An answer or any links would be helpful.
I was not completely aware of the reason. All I knew was the GET in the API route caches data by default. In my case also any caching happening?
My scenario is like I'm trying to list out online users in a page(/online). Where the /online is server component(non 'use client'). External API endpoint is used to get online users using Axios. I was only getting the users active at the time of initial page load and the list was not updating even if I hit refresh page several times. Then I added revalidation in the server component, all works fine.
I would like to know what had actually happened. An answer or any links would be helpful.
I was not completely aware of the reason. All I knew was the GET in the API route caches data by default. In my case also any caching happening?
you might want to open your own thread with these questions. You can ping me once for only this topic in your new thread
Holland Lop
Done!
American Cocker Spaniel
I have the same issue :
const response = await fetch(POSTS_RECOMMANDES_API_SUGGESTION, {
next: { revalidate: 50 },
});
this is not fetching new posts, I have to clear the Vercel cache manually to make it work. Did I miss something ?
const response = await fetch(POSTS_RECOMMANDES_API_SUGGESTION, {
next: { revalidate: 50 },
});
this is not fetching new posts, I have to clear the Vercel cache manually to make it work. Did I miss something ?
American Cocker Spaniel
seem to be the same as Vercel doc
Please create a new issue for it & ping me
American Cocker Spaniel
ok thanks