[Node.js] 익스프레스 - URL 파라미터 사용하기 (with 로그인 페이지)

URL 파라미터

클라이언트에서 요청할 때 URL 뒤에 ? 기호를 붙이면 요청 파라미터(query string)를 추가하여 보낼 수 있다. 클라이언트에서 서버로 데이터를 전달하는 방식은 이것 이외에도 URL 파라미터를 사용하기도 한다. URL 파라미터는 요청 파라미터와 달리 URL 주소의 일부로 들어간다.

로그인 페이지에 URL 파라미터 넣기

URL 파라미터를 어떻게 라우터로 전달하는지 이전에 작업한 로그인 페이지에서 작성해보자.

먼저 작성했던 index.html에서

<form method="post" action="/process/login/zini">

cs

form 태그의 action에 /zini를 추가한다.

이제 작성했던 app.js를 열고 router.route() 메소드 부분을

router.route('/process/login/:name').post(function(req, res) {     console.log('첫 번째 미들웨어 요청 처리');     var paramName = req.params.name;          var paramId = req.body.id || req.query.id;     var paramPw = req.body.password || req.query.password;     res.writeHead('200', {         'Content-Type': 'text/html;charset=utf8'     });     res.write('<h1>Express 서버에서 응답한 결과</h1>');     res.write('<div><p>Param Name: ' + paramName + '</p></div>');     res.write('<div><p>Param ID: ' + paramId + '</p></div>');     res.write('<div><p>Param PW: ' + paramPw + '</p></div>');     res.write("<br><a href='/login.html'>로그인 페이지로 돌아가기</a>");     res.end(); }); Colored by Color Scripter

cs

다음과 같이 수정해준다. app.post 메소드를 호출할 때 전달하는 첫 번째 파라미터의 값이 /process/login에서 /process/login/:name으로 변경되었다. 이것은 /process/login 뒤에 오는 값을 파라미터로 처리하겠다는 의미이다. 이렇게 지정한 파라미터는 req.params 객체 안에 들어간다. 따라서 :name으로 표시된 부분에 넣어 전달된 값은 req.params.name 속성으로 접근 가능한데, 이를 토큰(Token)이라고 부른다.

쉽게 말해서 /process/login/zini 와 /process/login/:name에서 빨간 부분이 서로 매칭되어 처리되는 것이다. js 파일을 실행하고 localhost:3000/login.html로 접속 후 로그인하면

성공적으로 요청 파라미터들을 받아왔음을 볼 수 있다.