항해 23일) Node.js- 라우팅

express에서 라우팅이라는 개념은 클라이언트로부터 요청받은 URL과 뷰를 매칭시키는 것이라고 할 수 있습니다. 라우팅이라는 사전적인 의미 그대로 특정한 URL에 대해 특정한 뷰로 연결하는 역할입니다. 

URL이라고 했지만 실제로 라우팅에 사용되는 정보는 호스트 이름을 제외하고 나머지 경로를 표시한 문자입니다.

예를 들어 다음과 같은 URL로 접속하면 라우팅 대상은 '/hello'라는 문자열이 됩니다.

http://localhost:3000/hello

 

다음은 express를 이용하여 웹 사이트 프로젝트를 만들면 생성되는 app.js의 일부분으로, 페이지 라우팅의 기본적인 구조를 보여줍니다.

 

app.get('/', function(req,res) {
    res.render('index.jade');
});

 

app.get 함수는 GET 방식으로 들어오는 경로를 연결하여, 이에 대응하는 동작을 콜백 함수로 기술할 수 있도록 합니다. 지정된 Path '/'으로, 웹 사이트의 루트(root) 페이지로 연결합니다. 루트 페이지란, 제일 처음 보이게 되는 메인 페이지를 의미합니다.

콜백 함수의 req는 요청객체(Request Object)이고 res는 응답객체(Response Object)입니다. 요청객체에는 클라이언트에서 보낸 여러 정보가 포함되어 있습니다. 응답 객체에는 우리가 클라이언트에 응답할 수 있게 하는 객체인데, 위에서 render() 이라는 함수로 뷰를 렌더링하게 되어 있습니다.

코드를 보면 쉽게 알 수 있듯이, 렌더링할 내용은 index.jade이고 이는 jade 형식으로 표현된 뷰파일입니다. jade는 외부모듈로, 템플릿 엔진 모듈입니다. jade는 후반부 강의에서 자세히 설명하도록 하겠습니다.

즉 한마디로 쉽게 설명하자면, 위 코드는 설정된 경로의 루트 페이지('/')로 접속했을 때, index.jade 페이지를 보여준다는 뜻입니다.

app.post 함수는 POST 방식으로 들어오는 경로를 연결합니다. POST 방식은 express Configuration에서 bodyParser를 포함해서 요청 객체의 body 속성을 통해 클라이언트에서 HTML Form으로 작성한 데이터를 읽어올 수 있습니다.

 

app.post('/post', function(req, res){
    res.render('write.jade', {
        id: req.body.id, 
        name: req.body.name 
    });
})

 

위의 코드는 write.jade로 랜더링하면서 id, name이라는 HTML Form의 Item으로 넘어온 값을 전달하여 출력하는 것입니다. 렌더링할 때에 id, name의 값이 jade 템플릿 엔진(현재는 pug로 이름 변경)을 통해 write.jade 파일에 넘겨지고 write.jade에는 이를 출력합니다.

express의 페이지 라우팅의 장점 중 하나는 라우팅을 유연하게 할 수 있다는 점입니다. app.get, app.post의 첫번째 매개변수에는 정규 표현식 등 특정 표현식을 사용할 수 있습니다.

 

app.get('/hello/:id', function(req, res) {
    var id = req.params.id;
    ~~
});

 

위 경우 http://localhost:3000/hello/world로 요청을 받았다면 req.params.id에는 'world'라는 문자열이 들어가게 됩니다.

URL을 이용해 값을 넘겨줄 수 있다는 뜻이지요.

만약 methodOverride를 설정에 추가하면 get, post 말고도 put 등의 REST 방식도 사용할 수 있습니다.

(REST 방식이란 Representational State Transfer의 약자로 데이터 전송 방식 중 하나를 의미합니다.)

 

 

 

 

 

 

 

 

 

 

참고

*라우팅

페이지 라우팅 - 한 눈에 끝내는 Node.js (goorm.io)