Next.js Discord

Discord Forum

Random error 500 on dynamic page load

Unanswered
Bartholomeas posted this in #help-forum
Open in Discord
BartholomeasOP
Hi, randomly on first enter to dynamic page with [slug] im getting error 500 like this, any ideas why its appearing here? It dissapears after page reload, like cache problem..

thats my current code: 

export const dynamic = 'force-dynamic'

const ProductSinglePage = async ({ params: { slug } }: NextPageProps<{ slug: string }>) => {
  const product = await getProductBySlug(slug)

  if (!product) notFound()

  const attributes = await getProductAttributes(product?.id)

  const {
    data: { sections },
  } = await getProductSections(slug)
  const similarProducts = await getSimilarProducts(product?.id)

  const similarProductsSectionSlug = 'podobne-produkty'

  const similarProductsSectionAnchor = {
    label: 'Podobne produkty',
    href: `#${similarProductsSectionSlug}`,
  }

  const anchors = Object.values(sections).map((el) => ({
    label: el.header,
    href: `#${el.slug}`,
  }))

  return (
    <>
      <GoogleAnalyticsSender event="view_item" data={product} />
      <ProductProvider product={product} attributes={attributes}>
        <div className="relative flex-col gap-8 bg-background">
          <Sections.ProductCoreSection product={product} />

          <ProductNavigation anchors={[...anchors, similarProductsSectionAnchor]} />
          <Sections.ProductSectionsHandler sections={sections} />

          {similarProducts ? (
            <Sections.ProductSimilarProductsSection
              id={similarProductsSectionSlug}
              products={similarProducts}
            />
          ) : null}
        </div>
      </ProductProvider>
    </>
  )
}

2 Replies

BartholomeasOP
export default ProductSinglePage

export const generateMetadata = async (
  { params: { slug } }: NextPageProps<{ slug: string }>,
  parent: ResolvingMetadata,
) => {
  const product = await getProductBySlug(slug)

  const parentMetadata = await parent
  const prevDescription = parentMetadata.description ?? ''
  const prevImages = parentMetadata.openGraph?.images ?? []

  const title = `${product?.metaTitle ?? product?.name} | ${COMPANY_NAME}`
  const description = product?.metaDescription ?? prevDescription
  const siteName = parentMetadata.openGraph?.siteName ?? COMPANY_NAME

  return {
    title,
    description,
    openGraph: {
      title,
      description,
      siteName: siteName,
      images: [product?.mainPictureId, ...prevImages],
    },
  }
}

thanks for any ideas!
i found that scripts with beforeInteractive may throw it
const Cookiebot = () => {
  return (
    <>
      <Script
        id="Cookiebot"
        src={`https://consent.cookiebot.com/uc.js?cbid=${COOKIEBOT_KEY}`}
        type="text/javascript"
        // strategy="beforeInteractive"
        async
      />
      <Script
        id="CookieDeclaration"
        src={`https://consent.cookiebot.com/${COOKIEBOT_KEY}/cd.js`}
        type="text/javascript"
        // strategy="beforeInteractive"
        async
      />
    </>
  )
}
export default Cookiebot


but when i do not attach itmy entire content of cookiebot alert is rendered at the end of body :/