📍 path parameter
path parameter란?
: url상에 어떤 가변적인 경로가 있다고 했을 때, 그 경로들을 원소로 가지는 집합의 이름을 매개변수로 지정한 것.
백엔드 서버에서는 통신할 때 :매개변수형태로 나타낸다.
예를 들어 여러 제품을 표시해주는 웹페이지의 제품별 리소스에 접근을 하려면 다음과 같은 코드가 필요하다.
router.get('/products/:productId', );위와 같이 :을 앞에 붙이면 뒤에 나오는 productId라는 경로를 찾는 게 아니라 productId는 매개변수(집합의 이름)이고, 인자(그 안의 원소들 중 하나)가 온다고 말해주는 것이다.
저 코드를 /products경로 상의 라우터들 중 맨 뒤에 배치해야 한다. path parameter를 포함한 라우터가 있는 순간부터 /products경로 상의 모든 라우터를 동적 라우터 취급하기 때문에 /product뒤에 어떤 가변적이지 않은 경로가 포함된 라우터 코드가 저 밑에 있다면 제대로 동작하지 않는다.
백엔드 서버에서 매개변수 안의 값을 추출하려면
const proId = req.params.productId;와 같이 params라는 객체 뒤에 path parameter를 적어주면 된다.
서버 상에서는 변수로 표현되더라도 클라이언트에서는 해당 매개변수가 실제 값(인자)으로 대체되기 때문에 url상에서는 : 없이 그냥 평범한 경로로 보인다.
path parameter의 사용
📍 query parameter
query parameter란?
: url에서 어떤 특정한 조건을 나타내주고 싶을 때 그 조건을 매개변수로 지정한 것. url 상에서는 맨 뒤에 ?와 함께 (쿼리 매개변수)=(그 조건의 상태)로 나타난다. 쿼리 매개변수가 두 개 이상일 때는 &를 통해 구분해 이어 적는다.
예를 들어 localhost:3000/add-product?edit=true&user=admin 이런 url이 있을 수 있다.
쿼리 파라미터는 http의 get, delete 요청에서만 사용된다.
백엔드 서버에서 매개변수(조건)의 상태를 추출하려면
const editMode = req.query.edit;와 같이 query라는 객체 뒤에 query parameter를 적어주면 된다.
query parameter의 사용
- filtering
ex)
- searching
ex)
-sorting
ex)
- pagination
ex)
📖 참조
https://velog.io/@juno97/API-Path-parameter-VS-Query-Parameter-%EA%B8%B0%EB%A1%9D%EC%9A%A9
