#Trouble understanding how cache works

4 messages · Page 1 of 1 (latest)

vale jungle
#

Hello. I'm having trouble with fetching my new data. I have a notes system, where you can upload and read all the notes. This is how I get the notes:

// more code
const response = await fetch(`/api/notes/get-all-notes`, { cache: 'no-store', next: { revalidate: 0 }});
                const data = await response.json();
                console.log(data);
                setNotes(data[0]);
// more code

However, /api/notes/get-all-notes doesn't get the new created notes until I explicitly go to localhost:3000/api/notes/get-all-notes and press CTRL + F5 to fully reload the page (then everything fetches data as intended).

Things that i've tried:

// On my component
const res = await fetch('my/api', { cache: 'no-store' });
const res = await fetch('my/api', { cache: 'no-cache' });
const res = await fetch('my/api', { next: { revalidate: 0 });
const res = await fetch('my/api', { cache: 'no-store', next: { revalidate: 0 });
const res = await fetch('my/api', { cache: 'no-cache', next: { revalidate: 0 });

// On the api route.tsx
return NextResponse.json([result.rows], {
      status: 200,
      headers: { 'Cache-Control': 'no-store, must-revalidate' },
    });

On my understanding, using those settings should clear the cahed notes, but didn't. Any ideas would be appreciated

arctic coralBOT
#

🔎 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)

vale jungle
#

Forgot to mention, I use vercel postgres database and this is my get-all-notes route.tsx:

import { sql } from '@vercel/postgres';
import { NextResponse } from 'next/server';

export async function GET(request:  Request) {
    try {
        const result = await sql`SELECT * FROM notes;`
        return NextResponse.json([ result.rows ], { status: 200  });
    } catch (err) {
        console.error(err);
        return NextResponse.json({ err }, { status: 500 });
    }
}

vale jungle
#

Just add export const dynamic = 'force-dynamic'; before the GET function thinq