HTTP 요청 파라미터 (Path, Query, Body)

api 응답을 주고 받을 때, 어떤 상황에서는 쿼리 파라미터에 데이터를 넣어 보내고 어떤 상황에서는 바디에 넣어 보내는데

정확히 “어떤” 상황일 때 달라지는지 알아보자.

먼저, HTTP 요청에서 사용되는 주요 파라미터는

Header, Path Parameter, Query Parameter, Body Parameter

가 있다.

헤더는 주로 인증 정보를 담고, api 케이스마다 변경되는 경우가 거의 없기 때문에 나머지 세개에 대해 자세히 살펴보겠다.

Path Parameter

URL의 경로(path)에 직접 포함되는 매개변수

사용 예시

• 특정 데이터의 식별

/movies/:id와 같은 형태로 표시되며

실제 사용은 id값에 해당하는 번호를 주소에 넣어 /movies/12처럼 사용하면 된다.

단, URL 경로에 직접 노출되는 만큼 보안에 민감한 데이터에는 적합하지 않다.

Query Parameter

URL에 추가되는 키-값 쌍으로 이루어진 매개변수들

사용 예시

• 검색 조건 전달, 필터링 및 정렬:

/products?category=electronics&price_range=100-500와 같이 사용해, 사용자가 전달한 카테고리와 가격 범위에 해당하는 제품을 검색할 수 있다.

Query Parameter 역시 URL 경로에 직접 노출되는 만큼 보안에 민감한 데이터에는 적합하지 않다.

Body Parameter

HTTP 요청의 본문(body)에 포함되는 데이터

사용예시

• 데이터 전달, 리소스 생성 또는 업데이트 (주로 POST, PUT, PATCH 등의 메서드에 사용)

데이터는 주로 JSON, XML 또는 폼 데이터와 같은 형식으로 전송된다.

React에서 fetch로 POST 요청을 보낸다고 가정하면 아래와 같이 사용할 수 있다.

// Data 예시 
const formData = {
    name: 'Gildong',
    email: 'gildong@example.com',
    age: '20'
}

// 요청 예시
await fetch('https://example.com/api/users', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(formData)
});