Nestjs의 POST 요청에서 URL 매개변수를 가져오거나 추출하는 방법은 무엇입니까?

Originally posted here!
POST 요청에서 URL 매개변수 값 또는 매개변수를 가져오려면 Nestjs의 컨트롤러 메서드 전에 @Param 모듈의 @nestjs/common 데코레이터 함수를 사용할 수 있습니다.

TL;DR

import { Controller, Post, Param } from "@nestjs/common";

// DTO
interface SendDetailsDTO {
  name: string;
  designation: string;
}

// the @Controller() decorator function will instruct Nestjs
// to add a route of `/greet`
@Controller("greet")
export class GreetController {
  // 1. The @Post() decorator function creates
  // an endpoint with URL parameters
  // of /:name/:desingation with the /greet endpoint.
  // 2. And using the @Param() decorator function
  // to extract the `name` and `designation` URL parameters
  @Post(":name/:designation")
  sendDetails(@Param() params: SendDetailsDTO) {
    // send response
    return {
      name: params.name,
      designation: params.designation,
    };
  }
}

예를 들어 다음과 같은 엔드포인트가 있다고 가정해 보겠습니다.

/greet/:name/:designation

보시다시피 URL 끝점에는 name 및 designation라는 필드가 있으며 앞에 : 기호(콜론)가 붙습니다. 이를 URL 매개변수라고 합니다.

이제 엔드포인트에 URL 매개변수가 필요한 이유를 물을 수 있습니다. 이에 대한 답은 각 URL 매개변수에 각각 할당되는 동적 값을 제공하는 것입니다.

따라서 :name URL 매개변수를 john 값으로, :designation URL 매개변수를 admin 값으로 대체하는 위 엔드포인트를 요청하면 다음과 같이 됩니다.

/greet/john/admin

서버 또는 백엔드 서비스에서 값이 name인 john라는 변수가 있고 변수 designation에 할당된 값admin이 있습니다. 위 끝점에서 유일한 정적 부분은 /greet 부분입니다. 이것은 엔드포인트에서 URL 매개변수의 일반적인 작업입니다. 멋지다! 🔥

이제 Nestjs 😃의 맥락에서 이에 대해 논의해 봅시다.

먼저 /greet 끝점을 만들어야 합니다. 이를 위해 GreetController라는 클래스를 만들고 @Controller 데코레이터를 사용하고 greet 문자열을 인수로 전달할 수 있습니다.

다음과 같이 할 수 있습니다.

import { Controller } from "@nestjs/common";
// the @Controller() decorator function will instruct Nestjs
// to add a route of `/greet`
@Controller("greet")
export class GreetController {}

이렇게 하면 '/greet'라는 엔드포인트가 생성됩니다.

이제 sendDetails() 끝점에 대한 POST 요청에서 호출되어야 하는 /greet/:name/:designation라는 메서드를 만들어 보겠습니다. 이를 위해 @Post 메서드 위에 sendDetails() 데코레이터 함수를 사용하고 ':name/:designation' 문자열을 인수로 전달해야 합니다.

다음과 같이 할 수 있습니다.

import { Controller, Post } from "@nestjs/common";
// the @Controller() decorator function will instruct Nestjs
// to add a route of `/greet`
@Controller("greet")
export class GreetController {
  // The will create an endpoint with URL parameters
  // of /:name/:desingation with the /greet endpoint
  @Post(":name/:designation")
  sendDetails() {
    // cool code here!
  }
}

이렇게 하면 /greet/:name/:designation 의 엔드포인트가 생성됩니다. :name 및 :designation URL 매개변수에서 값을 추출하려면 매개변수 변수가 있는 매개변수 괄호 안에 @Param 데코레이터 함수를 사용해야 합니다.

다음과 같이 할 수 있습니다.

import { Controller, Post, Param } from "@nestjs/common";
// the @Controller() decorator function will instruct Nestjs
// to add a route of `/greet`
@Controller("greet")
export class GreetController {
  // 1. The @Post() decorator function creates
  // an endpoint with URL parameters
  // of /:name/:desingation with the /greet endpoint.
  // 2. And using the @Param() decorator function
  // to extract the `name` and `designation` URL parameters
  @Post(":name/:designation")
  sendDetails(@Param() params) {
    // cool code here!
  }
}

params 변수에 유형을 추가하기 위해 SendDetailsDTO 및 name URL 매개변수에 대한 유형이 있는 designation라는 인터페이스를 사용하겠습니다.

다음과 같이 할 수 있습니다.

import { Controller, Post, Param } from "@nestjs/common";

// DTO
interface SendDetailsDTO {
  name: string;
  designation: string;
}

// the @Controller() decorator function will instruct Nestjs
// to add a route of `/greet`
@Controller("greet")
export class GreetController {
  // 1. The @Post() decorator function creates
  // an endpoint with URL parameters
  // of /:name/:desingation with the /greet endpoint.
  // 2. And using the @Param() decorator function
  // to extract the `name` and `designation` URL parameters
  @Post(":name/:designation")
  sendDetails(@Param() params: SendDetailsDTO) {
    // cool code here!
  }
}

마지막으로 name 변수에서 designation 및 params 값을 추출하고 sendDetails 메서드에서 개체로 반환하여 /greet/:name/:designation API 엔드포인트에 대한 응답으로 사용할 수 있습니다.

다음과 같이 할 수 있습니다.

import { Controller, Post, Param } from "@nestjs/common";

// DTO
interface SendDetailsDTO {
  name: string;
  designation: string;
}

// the @Controller() decorator function will instruct Nestjs
// to add a route of `/greet`
@Controller("greet")
export class GreetController {
  // 1. The @Post() decorator function creates
  // an endpoint with URL parameters
  // of /:name/:desingation with the /greet endpoint.
  // 2. And using the @Param() decorator function
  // to extract the `name` and `designation` URL parameters
  @Post(":name/:designation")
  sendDetails(@Param() params: SendDetailsDTO) {
    // send response
    return {
      name: params.name,
      designation: params.designation,
    };
  }
}

이제 /greet/john/admin 요청을 보내면 다음과 같은 응답을 받게 됩니다.

// response
{
  "name": "john",
  "designation": "admin"
}

Nestjs의 요청POST에서 URL 매개변수를 성공적으로 추출했습니다. 예이 🥳!

codesandbox에 있는 위의 코드를 참조하십시오.

이 페이지Hoppscotch URL를 방문하여 응답을 볼 수도 있습니다.

그게 다야 😃!

도움이 되셨다면 자유롭게 공유해 주세요 😃.