如何从 NextJS 中的动态 API 路由获取查询字符串？

Question

我有这样的文件 API 结构：

app/api/workspaces[id]/route.js

export async function GET(req: NextApiRequest) {
  console.log("CATEGORY ID", req.query);
  try {
    // I simplified this part, but in the project, I'm fetching the data using Prisma to Supabase
    const tasks = [];
    return NextResponse.json(tasks, { status: 200 });
  } catch (err) {
    return NextResponse.json(
      { message: `Could not fetch workspaces: ${err}` },
      { status: 500 },
    );
  }
}

我从我的 FE 调用这个 API：

  const { data: tasks, isLoading: isTasksLoading } = useQuery({
    queryKey: [`tasks-${params.id}`],
    queryFn: async () => {
      const response = await axios.get(`/api/workspaces/${params.id}`);
      return response.data;
    },
  });

在

route.js

中，我尝试

console.log(req.query)

，但我得到了

undefined

。我错过了什么？

更新

结果，我必须这样使用 GET 方法的第二个参数：

export async function GET(req, context: any) {
    const { id } = context.params;
}

但是，我不太确定这是什么类型

context

Answer 1

正如您在 doc 上所读到的那样，Next.js 将第二个对象作为参数传递给 API 处理程序，其中包含 slug 所在的

params

键。

但是您应该自己指定类型。另外，传递的请求类型是

NextRequest

，而不是

NextApiRequest

：

// app/api/workspaces[id]/route.js

import { NextRequest } from "next/server";

export async function GET(
  request: NextRequest,
  context: { params: { id: string } }
) {
  const { id } = context.params;
}