최근 진행 중인 chatterbox 스프린트의 서버를 Express 프레임워크로 리팩토링을 했습니다.
아직 이 스프린트를 통해 생각해봐야 할 것들이 많기 때문에, 과정을 되돌아보며 전체적인 흐름을 곱씹어보겠습니다.
Express 설치
먼저 작업 중인 디렉토리에 npm을 통해 Express 프레임워크를 설치합니다.
npm으로 너무 쉽게 프레임워크를 다운받을 수 있다는게 새삼 행복합니다.
npm install express --save--save 옵션을 통해 설치된 Node 모듈은 package.json 파일 내의 dependencies 목록에 추가됩니다. - Express 공식문서 중에서
서버 구동
해당 코드는 서버를 구동해줍니다.
const app = require('./request-handler'); // request-handler.js에서 Express()를 export 해줍니다.
const port = 3000;
// app.listen()은 http.Server를 리턴해줍니다. server라는 변수에 담았습니다.
// 선언한 포트 번호로 서버를 구동시킵니다.
// http는 http.createServer() 메서드로 서버를 구동시킵니다.
// 하지만 express는 app.listen() 메서드를 이용해 서버를 구동시킵니다.
let server = app.listen(port, () => {
// console.log(`Example app listening at http://localhost:${port}`)
})
module.exports = server;요청과 응답을 처리
해당 파일에서는 실제적으로 요청에 대한 응답을 처리하는 로직이 구현됩니다.
실제 데이터가 가공되는 공간이라고 할 수 있습니다.
필요 모듈 require
스프린트를 진행하기 위해 필요한 모듈들을 받아옵니다.
const fs = require('fs');
const cors = require('cors'); // npm install cors --save
const bodyParser = require('body-parser'); // npm install body-parser --save
const express = require('express');
const jsonParser = bodyParser.json();
const app = express();요청에 따른 분기
http 모듈을 사용했을 때는 if문으로 요청에 따른 분기 처리를 했습니다.
하지만 epxress 사용 시에는 훨씬 더 직관적으로 표현할 수 있습니다.
GET 요청일 시
json 형식으로 저장된 파일을 읽고, 읽은 데이터를 res.send() 메서드에 담아 전달해줍니다.
express에서는 res객체의 send 메서드를 사용하여 요청에 대한 응답을 처리합니다.
// GET 요청
app.get('/messages', (req, res) => {
getDataFromFilePromise('server/data.json')
.then((data) => {
res.send(data)
})
})POST 요청일 시
POST 요청을 처리할 때는 body-parser라는 유용한 미들웨어를 사용합니다.
body-parser라는 이미 구현된 미들웨이고, npm을 통해 다운로드를 받고 require로 받아온 후, 그 내장 메서드인 json()을 사용했습니다.
const bodyParser = require('body-parser'); // npm install body-parser --save
const jsonParser = bodyParser.json();
.
.
.
// POST 요청
// 미들웨어. jsonParser
// 아래와 같이 body-parser 미들웨어를 사용하게 되면, req.body에는 json 형식으로 payload가 담기게 됩니다.
app.post('/messages', jsonParser, (req, res) => {
getDataFromFilePromise('server/data.json')
.then((data) => {
fs.writeFile('server/data.json', '{"results": ['+JSON.stringify(req.body)+','+data.slice(13), (err) => {
if (err) throw err;
res.sendStatus(201);
});
})
})미들웨어
미들웨어는 요청을 받고 응답을 하는 과정의 중간중간에서 무언가를 덕지덕지 붙이거나, 불량이면 돌려보내는 역할을 합니다. Express의 큰 장점 중의 하나입니다.
미들웨어를 호출할 때는 app.use() 메서드를 사용합니다. 직접 미들웨어 함수를 구현해서 app.use() 메서드의 인자로 전달할 수도 있고, app.use() 메서드 안에서 익명 함수로 구현할 수도 있고, 이미 구현된 미들웨어를 require로 받아와서 사용할 수도 있습니다.
미들웨어를 통과하지 않으면 응답 처리를 해주지 않습니다.
미들웨어는 순서가 중요합니다. 호출된 순서대로 실행됩니다.
const defaultCorsHeaders = {
"access-control-allow-origin": "*",
"access-control-allow-methods": "GET, POST, PUT, DELETE, OPTIONS",
"access-control-allow-headers": "content-type, accept",
"access-control-max-age": 10 // Seconds.
};
// 직접 구현하는 미들웨어 함수는 req, res, next를 인자로 갖습니다.
// 들어오는 모든 요청의 method와 url을 확인할 수 있습니다.
const myLogger = function (req, res, next) {
console.log(`This request's method is ${req.method}, url is ${req.url}`);
next(); // 미들웨어를 사용할 때는 항상 next함수를 사용해줘야 합니다. 다음 미들웨어에게 토스한다고 생각하면 되겠습니다.
};
// cors()는 cors 허용 여부를 확인해주는 미들웨어입니다.
// 부합하다면 응답처리를 해주지 않습니다.
// 먼저 호출되었기 때문에 먼저 실행됩니다.
app.use(cors(defaultCorsHeaders));
// 요청의 method와 url을 로그를 통해 확인합니다.
// 앞전의 미들웨어에서 통과되지 않았다면, 이 미들웨어는 실행되지 않습니다.
app.use(myLogger);