typescript - Hvordan få verdien av en parameter i Next.js 13

Jeg vil hente verdien av en parameter fra et GET-endepunkt for:

/api/image/id

Filstrukturen er:

src/app/api/image/[id]/route.ts

Og når jeg prøver å hente id-parameteren, resulterer dette i null.

import { NextRequest, NextResponse } from "next/server";

export async function GET(request: NextRequest) {
  const id = request.nextUrl.searchParams.get("id");
  return NextResponse.json({ id }, { status: 200 }); // { "id": null }

Jeg tror dette har noe å gjøre med mappestrukturen. Men jeg kan ikke finne en riktig mappestruktur for dette.

Takk på forhånd!

Jeg prøvde å gi nytt navn til route.ts til [id].ts, og flyttet route.ts inn i bare bilde-mappen.

Svar #1

Jeg fant nettopp ut at i Next.js 13.2+, er den andre parameteren i GET-forespørselen stedet hvor utviklere finner parameterne.

import { NextRequest, NextResponse } from "next/server";

                                                // ⬇️ Here is the `params` property
export async function GET(request: NextRequest, { params }: { params: { id: string } } ) {

  return NextResponse.json({ id: params.id }, { status: 200 });

}

Jeg har prøvd uten hell å få det fra forespørselsobjektet. Kanskje det vil endre seg i fremtiden siden det er en tidlig versjon.

Svar #2

For å hente informasjon fra en URL, kan du bruke den valgfrie andre parameteren til ruterhåndtereren kjent som kontekst (dokumentasjon).

For eksempel, la oss anta at URL-en din er:

https://example.com/api/users/1

Du kan få tilgang til parameterverdien ved å bruke context.params.userId som vist i eksemplet nedenfor:

export async function GET(request, context) {
  const userId = context.params.userId; // '1'
}

Denne koden ble testet med følgende konfigurasjon:

// package.json
{
  "next": "13.2.4"
}

Relaterte artikler