사고쳤어요
Node.js의 req.params 알아보기 본문
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를 통해 사용자로부터 입력을 받고 그에 맞는 페이지를 연결해 보여줄 수 있다.
'웹 풀스택' 카테고리의 다른 글
Express 구조와 Express application generator (0) | 2025.02.14 |
---|---|
[Node.js] 유튜버 조회 서비스 - params에 맞는 json 전달하기 (0) | 2025.02.13 |
JSON과 사용법 (1) | 2025.02.12 |
Express 사용해보기 (0) | 2025.02.12 |
모듈, 라이브러리, 프레임워크와 모듈 사용해보기 (0) | 2025.02.10 |