Async page shows stale data both in dev and prod
Unanswered
piscopancer posted this in #help-forum
I got a route handler parsing another site, when. When I check this route, the information is always up to date. I use the function addressing this route and the page just does not care about it, as if it was fully cached.
the page is a dynamic route with a parameter which then "gets passed into the route handler" if you know what I mean.
the prod example of this page is here. this site is the object of the issue and it is safe for work
https://mkrs-beta.vercel.app/search/我
the page is a dynamic route with a parameter which then "gets passed into the route handler" if you know what I mean.
the prod example of this page is here. this site is the object of the issue and it is safe for work
https://mkrs-beta.vercel.app/search/我
30 Replies
Ok so you are making a get request to the external site right? @piscopancer
true
you can do the same if you prefix /search with /api
i decided to leave it in the prod for some reason 💀
@piscopancer true
ok, just to check but could you send me the part where you get the site?
ping me btw, im not on discord rn
ok so it looks correct, issue is that the response from it is always cached right?
could you show me how you are called the route handler
@Arinji
there is a function called query character that addresses the route handler and returns the whole parsed page as a string
https://github.com/piscopancer/mkrs/blob/master/src%2Fsearch.ts#L125-L133
there is a function called query character that addresses the route handler and returns the whole parsed page as a string
https://github.com/piscopancer/mkrs/blob/master/src%2Fsearch.ts#L125-L133
@Arinji
this function is called in the page
https://github.com/piscopancer/mkrs/blob/master/src%2Fapp%2F%28main%29%2Fsearch%2F%5Bslug%5D%2Fpage.tsx#L30
this function is called in the page
https://github.com/piscopancer/mkrs/blob/master/src%2Fapp%2F%28main%29%2Fsearch%2F%5Bslug%5D%2Fpage.tsx#L30
ok so the issue is ideally because of how you are using a route handler
it can be done in the page directly, instead of calling your own route handler
@piscopancer <@890486507872342027>
this function is called in the page
https://github.com/piscopancer/mkrs/blob/master/src%2Fapp%2F%28main%29%2Fsearch%2F%5Bslug%5D%2Fpage.tsx#L30
so you can just take the stuff you do in the route handler, and put it in this function directly(ignore the reply, meant to reply to the function not the page)
then call that function in your page
@Arinji but what's wrong with the route handler? it returns fresh data. removing it and doing it's job in the async page should not resolve the problem of page rendering stale data. I though of revalidating a page using const revalidate = 0, but does it even make sense? page is dynamic after all, it cannot be statically generated. Redeployment on vercel did not help either. server cache is preserved. Ok, maybe it's not the page, it's the route handler problem actually. I assume despite the RH returning fresh data, the server uses cached data anyway, because there actually is cached data. I theoretically need to revalidate the RH, not the page
@Arinji https://nextjs-faq.com/fetch-api-in-rsc
read this, issue isnt with the route handler, the issue is that you are fetching your own route handler in the code
huh, ok
the function calls the handler which is called by the page, which indirectly means that you are fetching your own route handler due to which cache is broken
lmao it shldnt be that hard, just take your code in the route handler and put it in the function which is being called by the page, then you dont even need to hardcode the whole https://site.com part
@piscopancer I need to smoke after this
trust me when i say, its gonna cause you more issues to not do this beforehand (i have spent 50 hrs in total trying to troubleshoot issues like this)
Try it out, if it solved the issue mark an answer, if it didnt ping me :D
okay
np