#stop caching in client

21 messages · Page 1 of 1 (latest)

frank basalt
#

I have a page that fetches a users tracked foods that they like and renders the list on the page. Each food list item redirects a user to another page. when the user removes a item from the list, then redirects to the a food page and comes back to the list page there list is stale with the old data. So if someone removed hamburger, it will still show up on the list. Is there an api I can use to invalidate the page when the link is clicked. Right now the best solution I can think of is to fetch the list on the client

marble cradleBOT
#
Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

steady bloom
frank basalt
#

api call

#

using express.js

steady bloom
# frank basalt api call

after that api call, run router.refresh()

import { useRouter } from "next/navigation"

const router = useRouter();
// ...
async function onClick() {
  await fetch(...)
  router.refresh()
}
frank basalt
#

I see

#

So that means I would have to refresh the page everytime someone adds/removes an item?

#

I won't be able to do that since I also have a modal with the ability to undo the add/remove action

steady bloom
#

the recommended way to do this is to use a server action, and inside that action run revalidatePath or revalidateTag to revalidate the page that you are navigating to.

but since you are not using a server action, you need to use router.refresh() to flush the router cache

#

there are only two ways to flush the router cache, revalidatePath/revalidateTag and router.refresh()

frank basalt
#

I don't think it's because of the router cache, I think it's to do with the browser cache

#

Cause when the user hits the back button on the browser the page is cached with the initial list values

steady bloom
#

it's most definitely the router cache. the browser bfcache only comes into play when the user clicks the back button. it's not like the user hits the remove button and then clicks the back button right?

steady bloom
frank basalt
#

Yeah figured this is an issue

steady bloom
#

bfcache is supposed to work like that: after hitting the back button one would expect to see the exact previous page (even when it's stale) rather than the newest data

frank basalt
#

Do you know a way to opt out of that behaviour?

steady bloom
#

client side rendering

frank basalt
#

Haha figured

#

Thanks man