错误：动态服务器使用：下一个13.4的标头

Question

这是生成错误的函数。它是一个简单的函数，用于从会话中获取令牌。

  4 | 
  5 | export async function getUserToken() {
> 6 | const session = await getServerSession(authOptions)
    |                                       ^
  7 | 
  8 | return session?.user?.token
  9 | }

我已经苦苦挣扎了几天，试图找出问题所在。到目前为止，我已经成功将其隔离到layout和page RSC，尝试使用next-auth的getServerSession。我需要能够传递会话以在后端进行请求，每当我尝试使用需要会话的API调用填充客户端组件时，就会抛出错误。

有什么见解或推荐的解决方法吗？

这是需要请求来填充TeamSwitcher的主要布局。

export default async function RootLayout({ children, params: { lng } }: Props) {
  const clients = await getClients()
  return (
    <>
      <div className="flex flex-col">
        <div className="border-b">
          <div className="flex h-16 items-center px-4">
            {/* @ts-expect-error Server Component */}
            <MainNav
              lng={lng}
              title={siteConfig.name}
              items={siteConfig.mainNav}
            />
            <div className="ml-auto flex items-center space-x-4">
              <TeamSwitcher clients={clients} />
              {/* @ts-expect-error Server Component */}
              <UserNav lng={lng} user={user} />
            </div>
          </div>
        </div>
        {children}
      </div>
    </>
  )
}

这是 API 调用，一切都非常简单明了。

export async function getClients(): Promise<Client[]> {
  const token = await getUserToken()

  if (!token) throw Error("Missing token for request")

  return await api
    .headers({
      accept: "application/json",
      token,
    })
    .get("/clients")
    .json()
}

- Dan Castrillo

---

我遇到了完全相同的错误，但是在不同的用例中。我正在检查令牌是否存在于服务器组件中（使用getServerSession）以执行重定向（如果未登录，则从索引重定向到登录等）。总体上也对这个错误感到困惑，我不知道为什么会出错。 - y_nk

目前我的解决方案是删除 getStaticProps，但我仍然不确定我是否理解了这个问题。对我来说，似乎与静态到动态渲染有关，但我找不到任何清晰解释它的文档。 - Dan Castrillo

Answer 1

添加

export const dynamic = "force-dynamic"

你需要在哪里获取getServerSession，Page，Layout或Route Handler。

如果你直接使用这个API而不是在Route Handler中使用它，那么你需要将上述代码添加到每个调用它的页面中，而如果你从组件内部调用它，根据文档，它将无法工作。因此，如果你需要多次使用它，则Route Handler是更好的选择。

Office doc

服务器渲染通常发生在一个地方，因此需要知道与用户相关的数据是动态的。

动态路由发生在获取一些数据之后，Next不能直接生成相应的页面或内容，因此需要动态指定。

- Rookie

Answer 2

我发现在使用静态生成时，使用这些函数会出现错误 - 只有在使用开发服务器时才会出现，不确定你是否遇到了同样的问题。

如果你只在开发服务器上遇到问题，但仍然希望为生产环境静态生成页面（我的情况），你可以在使用generateStaticParams并调用这些函数的任何路由中添加以下内容：

// what used to be export function generateStaticParams
function staticParams(){
...
}

// fix "dynamic server usage" errors in dev mode by turning off static generation and forcing dynamic rendering
export const generateStaticParams =  process.env.NODE_ENV === "production" ? staticParams :  undefined;
export const dynamic =  process.env.NODE_ENV === "production" ? 'auto' : 'force-dynamic';

- Ben Jack

---

这对我很有效 - 非常感谢！ - eandpi

Answer 3

这可能不是你想要的答案，但由于某些原因我遇到了相同的问题（请参阅您帖子中的评论）。

---

我找到了一种绕过这个问题的方法。虽然不是最理想的，但要感谢https://github.com/vercel/next.js/issues/48979#issuecomment-1539961418指出了https://nextjs.org/docs/app/api-reference/file-conventions/route-segment-config。

从我的错误堆栈中，我可以看到与你的相同的错误，但还有一些早期提到“静态渲染”的内容。

您可以添加export const dynamic ='force-dynamic';以避免在构建时进行静态预渲染，这应该可以解决问题（对我有效）。

- y_nk