How do I fix 'params should be awaited' in Next.js 15?

In Next.js 15, params, searchParams, cookies(), headers() and draftMode() became asynchronous. In 15 synchronous access still works temporarily with a warning; Next.js 16 removes it entirely, so await them now.

Server component page

// app/blog/[slug]/page.tsx
type Props = {
  params: Promise<{ slug: string }>;
  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
};

export default async function Page({ params, searchParams }: Props) {
  const { slug } = await params;
  const { page } = await searchParams;
  return <h1>{slug} / {page ?? 1}</h1>;
}

Client component page

Use React's use():

"use client";
import { use } from "react";

export default function Page({ params }: { params: Promise<{ slug: string }> }) {
  const { slug } = use(params);
  return <p>{slug}</p>;
}

generateMetadata and route handlers

export async function generateMetadata({ params }: { params: Promise<{ slug: string }> }) {
  const { slug } = await params;
  return { title: slug };
}

export async function GET(req: Request, { params }: { params: Promise<{ id: string }> }) {
  const { id } = await params;
  return Response.json({ id });
}

Codemod

npx @next/codemod@canary next-async-request-api .

Review the diff: it handles most cases but leaves a comment where it cannot be sure.

cookies and headers

import { cookies } from "next/headers";
const store = await cookies();
const token = store.get("session")?.value;

Pitfall: after switching, update your TypeScript types for params, otherwise npm run typecheck fails on the generated route types.