Next.js Discord

Discord Forum

Nextjs App Router cache the page...

Answered
Rampur Greyhound posted this in #help-forum
Open in Discord
Rampur GreyhoundOP
Hi everyone i have a nextjs app (with app router) with 3 pages Page1, Page2 and Page3... i have a server action that check if user is authenticated by a jwt saved as cookie
I use this server action in every page but if i change page for example from page1 i go to page2 and then i change in page1, page1 not call server action.
I try to put export const dynamic = 'force-dynamic' but nothing....
How can resolve this problem,
Answered by Ray
if you really need to run that action in every navigation, try running the server action in a useEffect. And if you need it to run on multiple page, you could use template.tsx for it
View full answer

24 Replies

if you really need to run that action in every navigation, try running the server action in a useEffect. And if you need it to run on multiple page, you could use template.tsx for it
Answer
@Rampur Greyhound You mean to put the check inside template?
yes put it inside useEffect in template
@Ray yes put it inside `useEffect` in template
Rampur GreyhoundOP
Great it works! So i'm using this flow to understand if it's present a cookie. With template and useEffect i can check it everytime that i change page... but i'd like to show error.js view if the check return false... Do you think is it possible?
but please note that this only work if the client have javascript enabled
Rampur GreyhoundOP
You suggest another solution?
only this solution for now😆
Rampur GreyhoundOP
There is something that not works....
├── app
│   ├── (main)
│   │   ├── books
│   │   │   └── page.tsx
│   │   ├── dashboard
│   │   │   └── page.tsx
│   │   ├── about
│   │   │   └── page.tsx
│   │   ├── layout.tsx
│   │   ├── loading.tsx
│   │   └── template.tsx
│   ├── login
│   │   └── page.tsx
│   ├── error.tsx
│   ├── favicon.ico
│   ├── layout.tsx
│   ├── loading.tsx
│   ├── not-found.tsx
in template i check if a cookie exists....
a simple method:
"use server"
export const userIsAuth = async () => {
  try {
    await checkCookie();
  } catch (error) {
    return "NO COOKIE";
  }
};
but error.tsx not shown
where is the error?
@Rampur Greyhound a simple method: "use server" export const userIsAuth = async () => { try { await checkCookie(); } catch (error) { return "NO COOKIE"; } };
throw the error
"use server"
export const userIsAuth = async () => {
  try {
    await checkCookie();
  } catch (error) {
    throw new Error("NO COOKIE")
  }
};
Rampur GreyhoundOP
nothing to do... it return this error and not error.tsx is shown
maybe try calling the action with useTransition
Rampur GreyhoundOP
nothing... probably i cant use this schema if i use "use client" in template
well it might be normal because error bondary does not catch
Error boundaries do not catch errors for:

Event handlers (learn more)
Asynchronous code (e.g. setTimeout or requestAnimationFrame callbacks)
Server side rendering
Errors thrown in the error boundary itself (rather than its children)
Rampur GreyhoundOP
So I have to use use state to set error is it right?
Rampur GreyhoundOP
I let you know thanks 🙏
Rampur GreyhoundOP
Ok I think to open a new thread for this problem I marked this as result