Dynamic Server Usage causing a 500

Help
1

I recently made some changes that involved some Drizzle + Supabase + Next.js changes. I tested everything locally running pnpm dev and everything worked out just fine. However, now that I merged the change… things aren’t working as expected. I get

[Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] {
  digest: 'DYNAMIC_SERVER_USAGE'
}
 ⨯ [Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] {
  digest: 'DYNAMIC_SERVER_USAGE'
}
 ⨯ [Error: An error occurred in the Server Components render. The specific message is omitted in production builds to avoid leaking sensitive details. A digest property is included on this error instance which may provide additional details about the nature of the error.] {
  digest: 'DYNAMIC_SERVER_USAGE'
}

When trying to access the new route. I verified that if I run pnpm build && pnpm start locally that this also happens but I don’t get any useful logs other than what I get in my Vercel logs which is the same as above. Running pnpm dev does not show anything in my terminal other than

 ⨯ [TypeError: controller[kState].transformAlgorithm is not a function] {
  digest: '895942525'
}
 ⨯ [TypeError: controller[kState].transformAlgorithm is not a function] {
  digest: '895942525'
}

but I have been getting those from time to time for awhile now. Any pointers on how to figure out the DYNAMIC_SERVER_USAGE would be great!

4

So the route I was trying to access was /vote/college/[sport]/[division] and I had

export async function generateStaticParams() {
  const divisions = ['fbs', 'fcs', 'd2', 'd3']

  return divisions.map((division) => ({ division }))
}

This then caused const { userId } = await auth() from Clerk to fail. Oddly enough this only failed when building and not in dev mode. I don’t need this statically generated anyways so removing it is fine. It’s just odd that this generateStaticParams caused clerk to fail/cause it to have a DYNAMIC_SERVER_ERROR as this generateStaticParams() has been there for a year along with the const { userId } = await auth().

5

Oh interesting. Have you tried talking to someone from the Clerk team about it? Can you share a public repo or a minimal reproducible example. That will let us all work together from the same code to figure out what’s going wrong.

6

I did reach out in their Discord but I think because I figured it out they probably won’t respond. I’m not sure how one would create a minimal reproducible example that involves auth :thinking:

1 Like
7

I see. For the minimal repro, you can create a Clerk Next.js app following this Next.js: Next.js Quickstart (App Router) and see if it recreates the issue.

8

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.