Notice
Recent Posts
Recent Comments
Link
«   2025/05   »
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
Archives
Today
Total
관리 메뉴

사고쳤어요

Node.js의 req.params 알아보기 본문

웹 풀스택

Node.js의 req.params 알아보기

kevinmj12 2025. 2. 13. 13:53

req.params 사용해보기

app.get("/products/:n", function (req, res) {
  res.json({
    params: req.params,
    num: req.params.n,
  });
});

만약 url에 포함된 숫자 또는 문자열을 사용해야 한다면 위와 같이 params를 사용하면 된다.

params는 URL로 전달되는 매개변수의 정보가 모두 담겨있으며, 

예를 들어 products/3에 접속한 경우 출력되는 json은 다음과 같다.

 

params에는 {"n": "3"}이 저장되어있고, params.n을 통해 3이라는 값을 꺼내 사용할 수 있다.

 

req.params의 타입

app.get("/products/:n", function (req, res) {
  console.log(typeof req.params.n);
  if (req.params.n > 10) {
    console.log("10보다 큼");
  }
  if (req.params.n - 13 > 0) {
    console.log("13보다 큼");
  }
  let number = req.params.n - 10;
  console.log(number);

  res.json({
    num: req.params.n,
  });
});

 

다음과 같이 url을 통해 n을 입력받고 여러가지 출력문들을 설정하였다.

/products/15에 접속하였을 때 출력되는 문장들은 다음과 같다.

 

"num": "15" 가 출력되는데, 그냥 15가 아닌 "15"가 출력되는 것과,

첫 줄에 string이라 출력된 내용을 보면 req.params.n의 타입은 string이라는 것을 알 수 있다.

그런데 string이라면 다른 number 타입과 비교, 덧셈, 뺄셈 등이 불가능할 것이다.

하지만 두 번째 줄부터 내용들을 보면 비교, 뺄셈 연산이 정상적으로 진행되어 출력되는 것을 볼 수 있다!

 

자바스크립트에서 params로 들어오는 내용은 string 타입으로 저장되지만, 상황에 맞게 타입이 맞춰지는 것이다.

그렇다면 만약 "15"가 아닌 15를 전달하고 싶다면 어떻게 해야 할까?

app.get("/products/:n", function (req, res) {
  res.json({
    num: parseInt(req.params.n),
  });
});

 

아주 간단하게 parseInt()라는 함수를 통해 string을 number로 변환할 수 있다.

덕분에 이제 "15"가 아닌 15가 출력되는 모습을 확인할 수 있다.

 

req.params 사용 예시

다음은 유튜브에서의 침착맨, 테오 채널의 주소이다.

https://www.youtube.com/@ChimChakMan_Official

https://www.youtube.com/@TEO_universe

 

위 채널 주소들의 공통점은 "youtube.com/" 뒤에 "@채널명" 이 붙는 것이다.

즉 유튜브에서는 @채널명을 params로 전달받아 채널명에 맞는 페이지를 연결해 사용자에게 보여준다.

 

다음 주소는 유튜브의 시작지점이 11초인 한 영상의 주소이다.

https://www.youtube.com/watch?v=iLIApgc5AMg&t=11s

마찬가지로 /watch 뒤에 v=iLIApgc5AMg, t=11s가 있어 비디오와 시작지점을 나타낸다.

만약 v 뒤에 다른 비디오의 값이 붙으면 다른 비디오가 나올 것이고, t 뒤에 다른 숫자가 붙으면 시작지점이 바뀔 것이다.

 

이와 같이 우리는 url과 params를 통해 사용자로부터 입력을 받고 그에 맞는 페이지를 연결해 보여줄 수 있다.