다양한 middlewares

  express의 개념은 크게 두 가지로 나뉜다. middleware와 route다. 그 중 우리는 여러 가지 middleware를 설치할 것이다.

  middleware에 대한 설명은 나중에 하겠다. 프로젝트를 진행함에 따라 수 많은 middleware를 설치할 건데, 지금 필요한 middleware를 설치할 것이다.

 

morgan

  morgan은 logging middleware다. 옵션으로는 dev를 줬다. dev 옵션은 밑에 형식으로 개발 사용을 위한 응답 상태별로 색상이 지정된 간결한 출력을 한다. :status 토큰은 성공 코드의 경우 녹색, 서버 오류 코드의 경우 빨간색, 클라이언트 오류 코드의 경우 노란색, 리디렉션 코드의 경우 청록색, 정보 코드의 경우 무색상이 된다.

middleware를 사용하고 싶다면 app.use() 안에 원하는 middleware를 인자로 주면 된다.

app.use(morgan('dev'));

:method :url :status :response-time ms - :res[content-length]

morgan 출력 결과

helmet

  helmet은 다양한 Http header를 설정함으로써 application을 보다 더 안전하게 만들어준다. 

app.use(helmet());

body-parser

  body-parser는 프론트 엔드의 form 형식으로부터 오는 data를 req.body로 받을 수 있게 도와준다. 예를 들어 form에 name="id"와 name="password"가 있다면 controller가 값을 받을 때, req.body.id와 req.body.password를 받을 수가 있다. 만약 body-parser가 없다면 form의 값을 받을 수가 없다. (아니 있는데 코드짜기 엄청 귀찮다. 그러니 다른 사람들이 만든 유용한 utility들을 사용하자.) 

  bodyParser.json()은 JSON 형식의 데이터 전달 방식이고 bodyParser.urlencoded({ extended: true})는 URL-encoded 형식의 데이터 전달 방식이다.

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

Cookie-parser

request의 cookie-header를 파싱하고 req.cookies 객체로 만든다.

app.use(cookieParser());

 

Middlewares가 추가 된 app.js

app.js

  middleware를 사용하려면 내가 설치한 패키지들을 먼저 import 해야 한다. import와 from 사이에 이름은 내가 원하는대로 지어도 상관없다. from 뒤에 오는 패키지 이름만 정확하면 된다. middleware를 사용하려면 app.use()를 사용해야 한다. app.use() 인자 값으로 원하는 middleware를 주면 실행이 된다. 또한 middleware는 순서가 굉장히 중요하다. JS는 위에서 아래로 실행이 된다. middleware는 실행이 끝나면 next()라는 것으로 다음 middleware에게 자신이 처리한 값을 준다. 즉, 위에서부터 점점 넘겨주는 값이 쌓여서 마지막에 app.get()에 모든 값이 넘겨진다. 그렇기 때문에 app.get()을 맨 위에 올려두게 된다면 app.get()은 helmet의 보호도 받지 못 하고 cookie 값이나 body-parser의 req.body 객체도 받지 못 한다.

참고 자료

• 노마드 코더의 유튜브 클론 강의
• morgan 설치
• helmet의 보안성
• helmet 설치 및 사용법
• body-parser 설치
• cookie-parser 설치
• Node.js 교과서 - 조현영
• app.use() 사용법

 

소스 코드

https://github.com/zpskek/wetube-v3/commit/276241753a3c7c3455332f338f2eb0080b7a0f02