Next.js Discord

Discord Forum

Requests are not deduplicated

Unanswered
Large oak-apple gall posted this in #help-forum
Open in Discord
Avatar
Large oak-apple gallOP
Looks like my project is not deduplicating requests during build time. Same endpoints gets hit multiple times (count at backend) resulting in tens or hundreds duplicate requests.

All requests in project are performed like following
// imported from another file
const nextRevalidate = {
  revalidate: 60,
}

const getSiteVariables = async function () {
  const res = await fetch('http://localhost:4000/api/globals/siteVariables', {
    next: {
      ...nextRevalidate,
    },
  })

  if (!res.ok) {
    console.log(res.statusText)
    throw new Error('failed to fetch site variables')
  }

  return res.json()
}


Package version is 13.4.10

How to fix it?

18 Replies

Avatar
Marchy
I wonder if this is because of the import? Can you recreate it by defining it without the import?
like
fetch('http://localhost:4000/api/globals/siteVariables', {
    next: {
      revalidate: 60,
    },
  })
Avatar
Large oak-apple gallOP
Same result with hardcoded value
Avatar
Marchy
try adding use server inside of your function

const getSiteVariables = async function () {
'use server';
  const res = await ...
I'm wondering if it's getting bundled with your client components
Generally, you don't want to fetch from the client but for revalidation it's valid. Does the data change often?
Avatar
Large oak-apple gallOP
It imports server-only package, as suggested in docks. And function is called from server components only
It throws error any time I try to use it in client components
Avatar
Marchy
Need more code then
Avatar
Large oak-apple gallOP
Not often. But it was built before cache tags were added, so frequent timer revalidation is used for most fetches in project
It is whole code of this function, there is no more. Consumer is either simple await or await Promise.all
Avatar
Marchy
I didn't say function, I said I need more code posted. I can't tell from just looking at this what's going on. Has this always happened?
Avatar
Large oak-apple gallOP
Probably always, only noticed it now
Which other code will help here?
Avatar
Marchy
Anything, really. Reproduction steps would be helpful as well
Avatar
Large oak-apple gallOP
npm run build, just that, no custom webpack configs or such
Avatar
Marchy
I mean code reproduction steps
Avatar
Large oak-apple gallOP
Here is structure of where this function is used, plus few more places
.
├── app/
│   ├── layout.tsx
│   ├── page.tsx
│   └── (main)/
│       ├── clinics/
│       │   └── page.tsx
│       └── doctors/
│           └── [slug]/
│               └── page.tsx
├── components/
│   ├── Footer.tsx -- used in root layout.tsx
│   └── Header.tsx -- used in root layout.tsx
└── utils/
    └── getSiteVariables.ts -- declared here