Next.js Discord

Discord Forum

How to revalidate my products

Unanswered
Ojos Azules posted this in #help-forum
Open in Discord
Ojos AzulesOP
I fetch products from my backend website. However, when I update certain products, I want my website, which displays these products, to update immediately without requiring a page refresh. What should I do?

This is my action to fetch the products from back-end:
"use server"

import qs from "query-string";

import { Product } from "@/types";

const URL = `${process.env.NEXT_PUBLIC_API_URL}/products`;


interface Query {
    categoryId?: string;
    isFeatured?: boolean;
}

const getProducts = async (query: Query): Promise<Product[]> => {
    const url = qs.stringifyUrl({
        url: URL,
        query: {
            categoryId: query.categoryId,
            isFeatured: query.isFeatured,
        },
    });

    const res = await fetch(url);

    return res.json();
};

export default getProducts;

12 Replies

<Milind ツ />
it depends.

If you are only fetching the products, you can make your getProduct function to not cache the data and generate on each page refresh.

If you updating as well in the same website, so after update, you can do revalidatePath or revalidateTag on getProduct.
Ojos AzulesOP
I am only fetching the products
<Milind ツ />
so in await fetch(url), do this:

await fetch(url, { next: revalidate: 60}})
60 is seconds iirc
this way next will revalidate the page if it sees new products
Ojos AzulesOP
I will try it, thank you!
Ojos AzulesOP
Doesnt work
i waited 60 seconds and nothing happened
<Milind ツ />
It revalidates on page load. If the website is already opened, it doesn't.
If you need it to update while website is already loaded, you might need react query I think.
@<Milind ツ /> It revalidates on page load. If the website is already opened, it doesn't.
Ojos AzulesOP
So i can make it revalite: 0?