Next.js 15+Supabase开发中cookies()未await警告及报错问题

架构老林

2026-6-14

问题根源

Next.js 15 的 App Router 中，服务器组件内的 cookies() 是异步函数，你直接调用未加 await，导致拿到的是 Promise 对象而非实际的 CookieStore，这就是控制台警告的原因。而你尝试 async/await 时出错，是因为错误地传递了 CookieStore 对象，而非 Supabase 要求的返回 CookieStore 的函数。

正确代码实现

服务器组件必须标记为 async，并按以下方式创建 Supabase 客户端：

async function Dashboard() {
  // 先 await 获取合法的 CookieStore
  const cookieStore = await cookies();
  
  // 关键：cookies 选项是返回 CookieStore 的函数，而非直接传递对象
  const supabase = createServerComponentClient({
    cookies: () => cookieStore,
  });

  // 示例：获取当前用户（需 await）
  const { data: { user }, error } = await supabase.auth.getUser();
  
  if (error) {
    return <div>Auth error: {error.message}</div>;
  }

  return <div>欢迎，{user?.email}</div>;
}

export default Dashboard;

常见错误分析

你触发的 Error: nextCookies.get is not a function 通常是以下两种情况导致：

直接传递 await cookies() 的结果给 cookies 选项（而非包裹成函数）：createServerComponentClient 内部会尝试调用你传入的 cookies 参数作为函数，如果你传的是 CookieStore 对象，自然没有 get 方法（这里的 nextCookies 指的是你传入的参数）。
未正确 await cookies()，导致传入的是 Promise 对象，Promise 也没有 get 方法。