Next.js Discord

Discord Forum

Metadata is outside <head>

Unanswered
Britannia Petite posted this in #help-forum
Open in Discord
Britannia PetiteOP
We have quite complicated metadata that requires us to do external API calls from inside generateMetadata(). For some reason, if these calls take a bit longer than usual metadata tags are written inside the body and not the head. I think this is some hydration issue. For example this works just fine:

export const generateMetadata = async ({
  params,
}: {
  params: { countryCode: string }
}): Promise<Metadata> => {
  
  return seoMetaData({
    title: "FAQ",
    description: "FAQ",
    countryCode: params.countryCode,
  })
}


When I add a small delay (think external API Call) it somehow places the meta descritpion, titile, cannocnicals etc OUTSIDE <head> into the body:

export const generateMetadata = async ({
  params,
}: {
  params: { countryCode: string }
}): Promise<Metadata> => {
  console.log("faq sleep")
  await new Promise((resolve) => setTimeout(resolve, 2000))
  console.log("after faq sleep")
  return seoMetaData({
    title: "FAQ",
    description: "FAQ",
    countryCode: params.countryCode,
  })
}


How can I fix this? I cannot pass static data into generateMetadata (e.g. make the API calls beforehand so generateMetadata has constnat runtime but I can also not not make the API calls in that method. Any suggestions?

5 Replies

I tried it and it looks like metadata on localhost is always rendered in <body> instead of <head>, no matter if it's a static or dynamic metadata
seems to be normal
CARSON.ts
Yea i found it too, looks good