** Dynamic Routes에 사용되는 데이터들은 Encoding하여 URL에 녹여서 보내거나 Request Body에 담아서 보내거나 둘 중 하나를 택하여 보내면 된다.
** 이번 Chapter에서는 Route Parameters를 어떻게 Passing할 것인지, Query Parameters를 어떻게 사용할 것인지, Model을 어떻게 고급화 할 것인지 다룬다.
Extracting Dynamic Parameters
•
URL을 통해서 Parameter를 넘기게 되면, 이 Parameter 값에 따라서 Routing을 할 수 있어야 한다.
•
Express의 Router에서는 해당 기능을 지원한다.
•
유동적인 Parameter에 대해서는 :Id와 같이 ':' 기호를 붙여서 활용한다.
•
이렇게 유동 Paramter에 대해서는 Routing Code 순서가 매우 중요하다. :를 이용하게 되면, :이전에 있는 Path를 포함하는 Route들이 모두 처리 되므로 순서에 주의하여야 한다.
•
Router에서 유동 Parameter를 :를 통해서 처리 했다면 Controller에서는 이를 어떻게 받아서 처리할 수 있을까? → request.params를 통해서 :로 지정한 Parameter에 접근할 수 있다.
Loading Product Detail Data
•
Array 속에 특정 Element를 찾으려고 할 때, Default JavaScript Method인 find() Method를 통해서 배열 속에 있는 모든 Element들을 확인하며 True값을 return하는 Element를 return하게 하여 쉽게 찾을 수 있다.
** Index 찾기는 findIndex() Method를 이용할 수 있고, 조건에 부합하는 것들을 return하게 하여 Array로 만들어 주는 filter() Method도 있다.
Passing Data with POST Requests
•
GET Method가 아닌 POST Method에 대해서 Request Body를 쓸 수 있다.
•
Request Body에는 Request를 보낸 페이지에서 담은 데이터가 담겨 있으며, 이는 form의 POST Method를 통해서 이용할 수 있다. 즉, POST Request에 모든 input의 데이터를 Body에 담아서 보낼 수 있는 것이다.
•
따라서 특정 Route로 데이터를 넘기고 싶다면 form안에 input을 작성하여 데이터를 담으면 되고 이를 submit, POST로 요청을 보내면 다른 페이지로 Route할 때 해당 데이터를 쓸 수 있다.
•
별도의 input을 받지 않는데도 form을 이용하여 데이터를 담아야 한다면 input을 선언하고 type으로 hidden처리를 한다면 해당 Input의 모습을 view에 보이지 않고 이용이 가능하다.
•
input에 대해서 조금 자세히 설명하자면, input은 인자로 type, name, value 등을 가질 수 있다. ejs를 이용하는 경우 ejs 문법을 이용하여 value에 담을 수 있으며, 이 value는 다른 view나 JavaScript에서 name 값으로 접근할 수 있다.
•
만일 Loop 안에 include된 Partial을 쓰고 싶고 해당 Partial안에는 Loop의 단일 변수를 인자로 사용해야 한다면 바로 그냥 쓸 수는 없다. Loop에서 쓰인 변수는 Local Variable이기 때문이다. 따라서 해당 변수를 include의 두 번째 인자로 따로 넘겨줘야 이용할 수 있다.
•
두 번째 인자로 넘길 때는, 이전과 마찬가지로 Map Data 형태로 넘겨주면 된다.
** Number Type으로 변환하는 방법으로는 Number() Method도 있지만 사용하려는 변수 바로 앞에 +를 붙여주어도 Number Type으로 인식한다.
Using Query Params
•
Dynamic Route를 위해 데이터를 URL 인자로 주어 해당 Parameter를 Controller에서 뽑아 쓸 수 있었다. 하지만 데이터 활용을 위한 것 이외에도 추가적인 확인을 위해서 사용하는 Parameter가 있는데 이것이 Query Parameter이다.
•
Query Parameter은 View 파일의 URL에서만 보였던 Dynamic Route와 달리, 실제 웹 페이지 링크에서 바로 확인할 수 있다.
•
Query Parameter은 '?'로 시작하여 URL에 여러 개를 쓸 수 있으며, 각각 '&'로 구분된다.
•
Dynamic Route와 또 다른 점이라 함은, Dynamic Route는 Router에 영향을 주는 반면에 Query Parameter는 Router에는 영향을 주지 않는다. 다만 넘겨받은 URL에서 정보를 추출하여 해당 데이터들을 Controller에서 처리한다.
•
그렇다면 URL에 작성한 해당 Query Parameter들은 어떻게 불러오게 되는가? → 이는 request.query.$queryParam로 불러오게 된다. (단, request.query로 불러온 모든 데이터들은 String으로 받아오게 되므로 Number Type, Boolean Type에 대해선 따로 처리를 해줘야 한다.)
•
Query Parameter를 넣는 방법은 Routing할 링크 뒤에 String으로 이어 쓰면 된다. '?' 이하는 Routing에 영향을 끼치지 않으므로 크게 신경 쓰지 않아도 된다.
** 통상적으로 Addition을 수행하는 Script와 Edit을 수행하는 Script가 있다면, General하게 사용할 수 있는 Edit만 사용한다.