[Express] 2. 미들웨어

Express 미들웨어

 

미들웨어(Middleware)란?

 

Express는 자체적인 최소한의 기능을 갖춘 라우팅 및 미들웨어 웹 프레임워크이며, Express 애플리케이션은 기본적으로 일련의 미들웨어 함수 호출입니다.

미들웨어 함수는 요청 오브젝트(req), 응답 오브젝트 (res), 그리고 애플리케이션의 요청-응답 주기 중 그 다음의 미들웨어 함수 대한 액세스 권한을 갖는 함수입니다. 그 다음의 미들웨어 함수는 일반적으로 next라는 이름의 변수로 표시됩니다.

미들웨어 함수는 다음과 같은 태스크를 수행할 수 있습니다.
모든 코드를 실행.
요청 및 응답 오브젝트에 대한 변경을 실행.
요청-응답 주기를 종료.
스택 내의 그 다음 미들웨어 함수를 호출.

express 공식 홈페이지의 설명인데,

 

간단히 요약하면 요청(request)과 응답(response) 사이에서(미들)에서 실행되는 함수들이다.

 

출처 : express 홈페이지 (https://expressjs.com/ko/guide/writing-middleware.html)

미들웨어의 구성은 위의 사진과 같다.

 

해당 미들웨어가 적용될 HTTP 메소드, 경로(라우트), 미들웨어 함수, 콜백 인수(다음에 실행될 함수) 등으로 구성되어있다.

이해를 돕기 위해 사용예시를 보자.

---

미들웨어의 사용 예시

 

HTTP 요청 body를 파싱하는 미들웨어인 body-parser를 이용해보자.

npm install body-parser

npm을 이용해 설치해준 다음,

var bodyParser = require('body-parser')

// 폼 타입 데이터를 다룰때 사용
app.use(bodyParser.urlencoded({ extended: false }))
// json 타입 데이터를 다룰 때 사용
app.use(bodyParser.json())

이렇게 불러와서 사용해주면 된다.

app.use(콜백함수)는 콜백함수에 작성된 미들웨어 함수를 마운트(장착) 하는 것으로, 

사용자가 요청할 때마다 (해당 js파일이 열릴때마다) 미들웨어 함수가 실행된다.

 

이제 구체적인 사용예시를 살펴보자.

function (request, response) {
    var body = '';
    request.on('data', function(data){
        body = body + data;
    });
    request.on('end', function () {
      var post = qs.parse(body);
      db.query(`INSERT INTO topic (title, description, created, author_id) 
          VALUES(?,?,NOW(), ?)`, [post.title, post.description, post.author],
        function (error, result) {
          if (error) throw error;          
          response.redirect(`/page/${result.insertId}`);
      });
    });
}

원래 이런식으로 form에서 전송한 데이터를 body에 담아서 사용했다면,

function (request, response) {
  var post = request.body;
  db.query(`INSERT INTO topic (title, description, created, author_id) 
      VALUES(?,?,NOW(), ?)`, [post.title, post.description, post.author],
    function (error, result) {
      if (error) throw error;          
      response.redirect(`/page/${result.insertId}`);
  });
}

body-parser는 request에 body를 추가해서 이렇게 사용할 수 있게 해준다.

---

app.use

app.use([path,] callback [, callback...])

app.use에 대해서 잘 살펴보면, 사용방식이 app.get과 동일하다는 것을 확인할 수 있다.

특정 경로에서만 사용하려면 path를 지정해 주면 되고,

미들웨어를 특정 상황 (get or post 등등)에 사용하려면 use를 get이나 post로 바꿔주면 된다.

 

이는 그동안 app.get의 callback함수 위치에 들어간 모든 함수들이 미들웨어나 마찬가지라는 소리가 된다.

 

---

미들웨어 만들기

app.use('경로', (req, res, next) => {
  /*code*/
  next()
})

app.get과 사용방법이 비슷하다. 경로를 따로 지정하지 않으면 모든 경로에서 실행된다.

next()함수는 해당 미들웨어가 실행 된 다음에 실행 될 함수를 말한다.

 

이렇게 만들어진 미들웨어를 Application-level middleware라고 부른다.

이와 반대로, npm 에서 설치한 body-parser 같은 미들웨어는 Third-party middleware라고 부른다.

 

Application-level middleware를 만드는 방법에 대한 자세한 설명은 아래 링크 참고

https://expressjs.com/en/guide/using-middleware.html#middleware.application

---

미들웨어 실행순서

 

미들웨어의 실행 순서는 간단하다. 위에 작성된 미들웨어가 먼저 실행된다.

 

이를 이용하면 간단하게 에러처리를 할 수 있다.

예를 들어, 해당 링크에 해당하는 페이지가 없음을 나타내는 에러를 표현하려면 다음과 같은 코드를 가장 아래에 작성해보자.

app.use(function(req, res, next) {
  res.status(404).send('Sorry cant find that!');
});

그러면 원하는대로 작성되지 않은 페이지에 접근하면 에러 메세지가 뜬다.

작성된 페이지에는 이미 그에 맞는 미들웨어가 앞서 실행되었을 것이므로, 위 함수가 실행되는 것은 지금 접속하는 url에 해당하는 페이지가 없다는 것을 의미한다.