노드로 가장 기본적인 웹 서버를 만드는 법을 알아보고 클라이언트에 응답을 보내 웹 페이지를 띄우는 법을 알아보겠습니다.
목차
- 익스프레스 서버 만들기
- 미들웨어로 클라이언트에 응답 보내기
익스프레스로 서버 만들기
익스프레스 모듈을 사용하기 전에 노드에 기본으로 들어있는 http 모듈을 사용하여 서버를 만드는 법을 보겠습니다. 급하신 분들은 express를 사용한 부분만 봐도 됩니다.
var http = require('http');
// 웹 서버 객체 만들기
var server = http.createServer();
// 웹 서버를 시작하여 3000번 포트에서 대기
var port = 3000;
server.listen(port, function(){
console.log('웹 서버가 시작되었습니다 %d : ', port);
});가장 기본적으로 서버가 실행될 포트넘버만 인자로 받을 수도 있습니다. 따로 설정하지 않으면 ip는 localhost로 됩니다. 이렇게 생성한 서버는 localhost:3000으로 요청을 보낼 수 있습니다.
http 모듈만으로도 웹 서버를 만들 수 있지만, 웹 서버의 기능 구현을 더 편리하게 하기 위해 익스프레스(express) 모듈을 사용하여 서버를 만듭니다. 익스프레스 모듈로 서버를 만드는 방법은 다음과 같습니다.
익스프레스 모듈을 사용하기 위해 % npm install express --save 명령어로 익스프레스 모듈을 설치합니다. 설치 후 다음과 같은 방법으로 서버를 만들 수 있습니다.
//Express 기본 모듈 불러오기
var express = require('express'), http = require('http');
var app = express();
// 기본 포트를 app 객체에 속성으로 설정
app.set('port', 3000);
// Express 서버 시작
http.createServer(app).listen(app.get('port'), function(){
console.log('익스프레스 서버를 시작했습니다. : ', + app.get('port'));
});기본적으로 http 모듈을 사용하지만 서버를 생성할 때 익스프레스 객체를 넣어 익스프레스 서버를 만들 수 있습니다.
익스프레스 객체의 set 메소드는 (하나의 변수를 설정하듯이) 속성을 설정할 수 있습니다. 위의 코드에선 port 속성이 3000이란 값을 가지도록 설정했습니다. 설정한 속성의 값은 익스프레스 객체의 get 메소드로 가져올 수 있습니다.
(익스프레스에는 미리 정해진 속성이 있는데 env, views, veiw engine 속성은 설정하면 특별한 역할을 수행합니다.)
미들웨어로 클라이언트에 응답 보내기
크롬과 같은 브라우저로 웹 서버에 접속하는 것은 클라이언트가 웹 서버에 요청을 하는 것입니다. 웹 페이지가 뜨는 것은 웹 서버가 이러한 요청에 응답으로 웹 페이지를 줬기 때문입니다.
이러한 응답은 http 모듈로 만든 서버에선 다음과 같은 방법으로 할 수 있습니다.
// 클라이언트 요청 이벤트 처리
server.on('request', function(req, res){
console.log('클라이언트의 요청이 들어왔습니다.');
res.writeHead(200, {"Content-Type": "text/html; charset=utf-8"});
res.write("<!DOCTYPE html>");
res.write("<html>");
res.write(" <head>");
res.write(" <title>응답 페이지</title>");
res.write(" </head>");
res.write(" <body>");
res.write(" <h1>노드제이에스로부터의 응답 페이지</h1>");
res.write("</html>");
res.end();
});클라이언트의 요청이 들어오면 request 이벤트가 발생하는데, 이 request 이벤트를 설정하여 응답할 수 있습니다.
express 서버는 미들웨어를 사용하여 응답을 보낼 수 있습니다. 미들웨어는 요청과 응답 정보를 받아 처리하는 하나의 함수라 볼 수 있습니다. 서버에 요청이 들어오면 가장 먼저 생성된 미들웨를 거치게 됩니다.
이러한 미들웨어를 사용하여 익스프레스 서버에서 응답을 할 수 있습니다.
var express = require('express'), http = require('http');
var app = express();
app.use(function(req, res){
console.log('첫 번째 미들웨어에서 요청을 처리함');
res.writeHead('200', {'Content-Type':'text/html;charset=utf8'});
res.end('<h1>Express 서버에서 응답한 결과입니다.</h1>');
});
http.createServer(app).listen(3000, function(){
console.log('Express 서버가 3000번 포트에서 시작됨.');
});익스프레스의 use 메소드로 미들웨어를 설정할 수 있습니다. 클라이언트의 요청은 이렇게 설정한 미들웨어를 거치게됩니다.
미들웨어를 여러개 설정하면 미들웨어 내에서 next 메소드를 사용하여 다음 미들웨어를 실행할 수 있습니다.
var express = require('express'), http = require('http');
var app = express();
app.use(function(req, res){
console.log('첫 번째 미들웨어에서 요청을 처리함');
req.user = 'mike';
next();
});
app.use(function(req, res){
console.log('두 번째 미들웨어에서 요청을 처리함');
res.writeHead('200', {'Content-Type':'text/html;charset=utf8'});
res.end('<h1>Express 서버에서' + req.user + '응답한 결과입니다.</h1>');
});
http.createServer(app).listen(3000, function(){
console.log('Express 서버가 3000번 포트에서 시작됨.');
});
익스프레스로 서버를 만들면 서버의 기능 구현을 더 편리하게 할 수 있다고 했는데, 이는 미리 만들어진 미들웨어를 가져와 사용함으로써 가능합니다. 이에 대해선 다음 글에서 다루도록 하겠습니다.
Reference
- Do it! Node.js 프로그래밍
'개발 > Node.js' 카테고리의 다른 글
| [Node.js] 패스포트 (passport) 사용법 - 로컬 인증 방식 (0) | 2021.01.21 |
|---|---|
| [Node.js] 익스프레스로 웹 서버 만들기 2 - 자주 쓰이는 미들웨어 (0) | 2021.01.15 |
| [Node.js] 뷰 템플릿 적용하기 - ejs 뷰 (2) | 2021.01.11 |
| [Node.js] windows에서 노드 버전 변경 - downgrade/upgrade (1) | 2021.01.11 |
| [Node.js] 익스프레스에서 몽고디비 사용법 4 - 비밀번호 암호화 (0) | 2021.01.08 |
댓글