Dynamic metadata fails fetch on SSG Components #53036
Answered
by
hyjoong
nicolasCinzer
asked this question in
Help
-
SummaryHi NextJS Community! 😄 Im strugglin with this error! In my app theres a dynamic route that im trying to generate statics props for some Link components. My problems appears when building is running... If i generate the metadata like this: export async function generateMetadata({ params: { name } }: Props): Promise<Metadata> {
const [exercise]: Exercise[] = await getExercises({ name, queryType: 'equal' })
console.log(exercise)
if (!exercise.id) {
return {
title: 'Exercise not Found'
}
}
return {
title: exercise.name,
description: `This is the page of ${exercise.name}`
}
}The build fails on fetching and generating those pages The builds message: but if i remove the fetch getExercises() and set the title of the name param like this: export async function generateMetadata({ params: { name } }: Props): Promise<Metadata> {
// const [exercise]: Exercise[] = await getExercises({ name, queryType: 'equal' })
// console.log(exercise)
// if (!exercise.id) {
// return {
// title: 'Exercise not Found'
// }
// }
return {
title: /* exercise. */name,
description: `This is the page of ${/* exercise. */name}`
}
}The build runs like butter! Im missing some point on this? Or theres a problem? Thx community! Additional informationNo response ExampleNo response |
Beta Was this translation helpful? Give feedback.
Answered by
hyjoong
Jul 22, 2023
Replies: 1 comment 4 replies
-
|
Use the try{} catch{} statement. export async function generateMetadata({ params: { name } }: Props): Promise<Metadata> {
try {
const [exercise]: Exercise[] = await getExercises({
name,
queryType: "equal",
});
return {
title: exercise.name,
description: `This is the page of ${exercise.name}`,
};
} catch (e) {
return {
title: "Exercise not Found",
};
}
} |
Beta Was this translation helpful? Give feedback.
4 replies
-
|
Thx @hyjoong! This works for me. BTW, the build runs correctly but im getting the same error as well, do you know why this happening? As i said, the build finish correctly and i can start the app, but those fetchs i really dont know where the f*ck come from. Any idea? Thx again! |
Beta Was this translation helpful? Give feedback.
-
|
Based on the code of your project, it appears that the issue might be related to SSG implementation and the number of communications occurring during the build process, specifically in the generateStaticParams function where the programs are being created. It seems that these communications are all directed to During your development mode, running the server locally allows the communications to work without errors. However, during the SSG build process, the localhost server cannot be accessed, leading to communication failures and resulting in error messages. You believe that once the server is deployed and the communication URL is updated to the server's address, the issue should be resolved. |
Beta Was this translation helpful? Give feedback.
-
|
The reason why this code first encountered a build error is because export async function generateMetadata({ params: { name } }: Props): Promise<Metadata> {
const [exercise]: Exercise[] = await getExercises({ name, queryType: 'equal' })
console.log(exercise)
if (!exercise.id) {
return {
title: 'Exercise not Found'
}
}
return {
title: exercise.name,
description: `This is the page of ${exercise.name}`
}
}
1. const [exercise] // exercise may not be destructure-assigned.
2. if (!exercise.id) {} // exercise could be undefined, leading to the inability to read the exercise.id value.There is a chance of communication failure in your code, and you tried to destructure the response object However, in my opinion, using a try{} catch{} block to handle communication failures seems better than relying solely on optional chaining. |
Beta Was this translation helpful? Give feedback.
-
|
U explained this so clearly bro, im so greathfull, leaves me no doubt about it. BTW, the last response that i made, was running with try catch on generateMetadata... So im not secure that those errors triggers because exercise might be undefined. However, this helps me so much to understand some implications on NextJS. 10 Points response. Thx A LOT!!! |
Beta Was this translation helpful? Give feedback.
Answer selected by
nicolasCinzer
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Use the try{} catch{} statement.