Express-쿼리스트링 & Semantic url

사이트를 이용할 때 , url을 입력해서 들어가는 경우가 있다 . 

예를 들면 다음과 같다 . 

www.tistory.com?id=1

www.tistory.com?id=2

www.tistory.com?id=3

위 주소에서 ?id=x  와 같은 것을 쿼리 스트링이라고 한다 . 

코드를 통해서 간단하게 알아보자 . 

app.get('/topics?:id',function(req,res)

{

  var topics = [

    'inwoo',

    'inwoo1',

    'inwoo2'

  ];

  var output = `

    <a href="/topics?id=0">inwoo</a><br>

    <a href="/topics?id=1">inwoo1</a><br>

    <a href="/topics?id=2">inwoo2</a><br><br>

    ${topics[req.query.id]}

  `

  res.send(output);

})

위 코드를 보면 , get으로써 /topics 의 Router 을 통해 ?:id 을 함으로써 , 사용자의 id 입력값을 받아주었다.

그리고 topics 의 배열에 각각의 값이 저장되어 있고 , 

실제로 출력이 되는 output 변수를 보면 , 각각의 값에 주소값이 들어있으며 , 

클릭을 함으로써 , 그 각각의 url 주소로 넘어가 지는데 , url을 보게 되면 

쿼리 스트링으로써 입력되어 있다 . 

그 결과 값은 topics의 배열의 각각의 값이며 , req.query.id 가 사용자가 입력한 값이다 . 

결과 화면은 다음과 같다 . 

위와 같은 방법도 있지만 , Sematic Url 이라는 방법도 있다 . 

sematic url이라는 것은 , 쿼리 스트링 처럼 ? 를 통해서 어떠한 값을 전달하는 것이 아니라 , 

www.tistory.com/1

www.tistory.com/2

www.tistory.com/3

위 처럼 / 를 통해서 원하는 주소값을 바로 입력하는 경우이다 . 

코드를 통해서 확인해 본다 . 

위 코드와 비슷하지만 , 입력하는 id와 name 두개를 받아 보았다 . 

app.get('/topics/:id/:name', function(req,res)

{

  res.send(req.params.id+','+req.params.name);

})

결과 화면은 다음과 같다 . 

위 처럼 / 를 통해서 url 을 접근할 수 있다 . 

편한지는 솔직히 잘 모르겠다 .