Can I call fetchContent inside generateMetadata to personalize the page title?
We personalize the hero on our category pages and I would like the meta title and description to match the variant the visitor sees, instead of a generic title that contradicts the hero.
Two things I need to be sure about before doing this:
- Does fetchContent work inside generateMetadata, and if I fetch the same slot there and in the page component, do both resolve to the same variant for the request?
- What do crawlers end up seeing? I want to be certain this cannot be read as cloaking on our side
1 answer
Both concerns have clean answers.
-
Yes, fetchContent works in any server context, and generateMetadata is one. Fetching the same slot in the metadata function and in the page resolves consistently for the request, so the title you emit matches the hero the visitor gets. Something like:
export async function generateMetadata(): Promise<Metadata> { const {title, description} = await fetchContent('category-hero', {fallback}); return {title, description};} -
On crawlers: a crawler is just a request without a prior session, so it gets default or audience-matched content, server-rendered in the HTML. The title in the markup is the title that was actually served for that request. There is no client-side swap after the fact, which is the pattern that creates cloaking-shaped discrepancies. What the bot fetched is what the bot sees.
One operational note: calling fetchContent in generateMetadata opts the route into dynamic rendering, same as calling it in the page. If your category pages already fetch the slot for the hero, that cost is already paid.
Clear on both points, thanks. The routes are already dynamic because of the hero fetch, so this is effectively free for us. Shipping it this sprint.