node.js 기초 -4- (query string)

쿼리 스트링

지금까지 공부했던 내용은 get을 통해 router로 연결을 한 홈페이지 작성이다. 즉, 주소의 path 부분을 바꾼다면 다른 홈페이지를 만들 수 있었는데, 만약 같은 path로 다른 홈페이지를 보여줄 수 있다면 어떨까?

쿼리 스트링은 위와 같은 문제를 해결할 수 있다.

http://abc.com/topic?id=1&pass=3004

이라는 주소가 있다 가정한다면http = 프로토콜, abc.com = 도메인, topic = path, id=1, pass=3004 = 쿼리 스트링이다.

app.get("/topic", function (req, res) {
  res.send(req.query.id + "," + req.query.pass);
});

쿼리 스트링의 값을 알아내기 위해서 query.매개변수 값을 사용하며, 2개 이상을 알기 위해서는 ","을 이용한다.

응용하기

만약 사진과 같이 홈페이지를 누르면 쿼리 스트링의 변경과 출력을 원한다면 아래와 같이 작성해야한다.

쿼리 스트링을 알기 위해서는 req.query를 사용한다.

app.get("/topic", function (req, res) {
  var topics = ["java", "python", "nodejs"];
  var links = `
  <a href='/topic?id=0'>java</a><br>
  <a href='/topic?id=1'>python</a><br>
  <a href='/topic?id=2'>nodejs</a><br><br>
  ${topics[req.query.id]}
  `;

  res.send(links);
});

정규표현식을 통해 쿼리 스트링 아이디를 가져온 값의 인덱스를 넣어서 출력시킨다.

시맨틱 URL

만약 주소가 http://abc.com/topic/0 라면 위의 코드는 잡지 못한다. 이러한 구조를 시맨틱 URL이라 하며 구현을 위해서는 아래와 같다.

app.get("/topic/:id", function (req, res) {
  var topics = ["java", "python", "nodejs"];
  var links = `
  <a href='/topic?id=0'>java</a><br>
  <a href='/topic?id=1'>python</a><br>
  <a href='/topic?id=2'>nodejs</a><br><br>
  ${topics[req.params.id]}
  `;

  res.send(links);
});

get의 주소에 :매개변수 를 넣으며, req.query가 아닌 req.params를 사용한다.

http://abc.com/topic/0/alphabet 과 같이 여러개의 시맨틱을 사용하기 위해서는 아래와 같다.

app.get("/topic/:id/:alpha, function(req, res){
	res.send(req.params.id + ',' + req.params.alpha)
   });