`params` should be awaited

Question

I have a get endpoint as follows:

import { NextResponse } from 'next/server';
import connection from '@config/db';

export async function GET(req: Request, context: { params: { providerId: number } }) {
  const providerId = await context.params.providerId;

  // Placeholder for current user ID (replace this with actual user ID from session/auth)
  const currentUserId = 2; // Change to dynamically fetch from your auth system
  ...

It works but I get this error:

Error: Route "/api/appProviders/listProvider/[providerId]" used params.providerId. params should be awaited before using its properties. Learn more: https://nextjs.org/docs/messages/sync-dynamic-apis

How I could get rid of it?

Answer 1

This happens in the latest nextjs 15. Make it first to store await params, then you can retrieve the params from the layout.

Example:

export default async function RootLayout({
children, 
params
    }: 
 Readonly<{
      children: React.ReactNode;
      params: { locale: string }
  }>) {
param = await params // {locale: "id"}
const locale = await param.locale // id

Answer 2

I have the same issue.

Or you using turbopack, like that for dev : next dev --turbopack ? I tried without and the 'error' disappeared.

And of course I've awaited my params like that for exemple :

export default async function Blog({
  params,
}: Readonly<{
  params: Promise<{ lang: Locale }>;
}>) {
  const { lang } = await params;

I haven't found any issue on github about this, I'll think about opening one.