Next.js Discord

Discord Forum

Server Component on page not updating at runtime (only build time)

Answered
German Spaniel posted this in #help-forum
Open in Discord
German SpanielOP
In my page.tsx it looks like my API call is getting cached or only ran once at build time. I'm trying to make it so that this API call will happen on every pageload, but for some reason it's only happens once and then never again on subsequent page loads. This function should return a different response every day based on the daily puzzle, but once it hits day 2 it still shows the day 1 puzzle because the page is not being updated. Other API routes use getDailyPuzzle() and it updates to the new day 2 puzzle correctly on the backend, but the page still looks the same as the day 1 puzzle and it doesn't trigger the function after the first ever time.

export default async function MainPage() {

    const puzzle: Puzzle = getDailyPuzzle()

    return (
        <div className={`relative ${oswald.className} overflow-x-hidden`}>
            <Navbar />
            <GameScreen puzzle={puzzle} />
        </div>
    )
}
Answered by aardani
in order for it to change per request you can use export const dynamic = 'force-dynamic'
View full answer

15 Replies

can i see the route list in the build log of the mainpage? @German Spaniel
@aardani can i see the route list in the build log of the mainpage? <@702064568809160754>
German SpanielOP
hm I'm using a dockerfile
would that be generated with next build somewhere
yes
German SpanielOP
@aardani
this?
Route (app)                              Size     First Load JS
┌ ○ /                                    137 kB          217 kB
├ ○ /_not-found                          883 B          81.4 kB
├ λ /api/common                          0 B                0 B
├ λ /api/guess                           0 B                0 B
├ λ /api/refresh                         0 B                0 B
└ λ /api/stats                           0 B                0 B
+ First Load JS shared by all            80.5 kB
  ├ chunks/864-ecf428c55e25200f.js       27.5 kB
  ├ chunks/fd9d1056-1935089ddbafe714.js  51 kB
  ├ chunks/main-app-dfcd5dbc52502479.js  232 B
  â”” chunks/webpack-8252b6152997d072.js   1.82 kB
yes perfect
as you can see your / is static that means it will always be cached and only generated at build time
in order for it to change per request you can use export const dynamic = 'force-dynamic'
Answer
German SpanielOP
oh sweet
even if the API is dynamic (lambda) the page that renders the page is not
German SpanielOP
thank you so much i'll try that
hard to find that in the docs lol
let me know if it works and dont forget to mark the answer as answered
German SpanielOP
will do
I think it worked, thanks for the help 🙂