04. [ 미들웨어 ]

https://expressjs.com/en/guide/writing-middleware.html

Writing middleware for use in Express apps

 

var express = require('express');
var app = express();

app.get("/cats/d", (req, res) => {
  console.log(req.rawHeaders[1]);
  res.send({ d: Cat[3] });
});

app.listen(8000);

 

 

app.get ({}) 부분이 중간에 매개를 할 수 있도록 하는 미들웨어 라우터라고 한다.

 

• 이 라우터는 클라이언트 또는 프론트엔드가 해당하는 엔드포인트 ('/cats/d')로 get 요청을 보낸다.
• API 요청 시 express는 위에서 아래로 코드를 읽으며 해당 엔드포인트를 찾는다.
• 엔드포인트와 method가 동일하면 콜백함수 첫 번째 인자에 req정보, 두 번째 인자에는 res정보가 담긴다.
• 응답에 send 메서드를 사용하여 프론트엔드에 리소스를 보낸다.

---

여기서 저 로깅해주는 부분이 여러개로 늘어난다면? 

//강의코드中

app.get("/cats/a", (req, res) => {
  console.log(req.rawHeaders[1]);
  res.send({ a: Cat[0] });
});

app.get("/cats/d", (req, res) => {
  console.log(req.rawHeaders[1]);
  res.send({ d: Cat[3] });
});

 

하나하나 확인하고 연결하는 과정이 비효율적이다. 

라우터가 2개가 있다. 로깅을 하는 로직이 반복되고 코드가 거의 흡사하다.

//미들웨어
app.use((req, res, next) => {
  console.log(req.rawHeaders[1]);
  next();
});

app.get("/cats/a", (req, res) => {
  res.send({ a: Cat[0] });
});

app.get("/cats/d", (req, res) => {
  res.send({ d: Cat[3] });
});

위 코드는 미들웨어를 사용한 것이다. java에서 중복되는 부분을 따로 빼내어 공통 메서드를 만들어서 쓰는 것과 비슷하다.

 

동작은 이러하다.

• 프론트에서 미들웨어를 한번 거치고 log를 찍는 부분을 실행한다.
• next 함수로 라우터를 찾는다.
• ** 미들웨어는 위치가 중요하다. 맨 하단에 있게 될 경우 코드는 위에서 아래로 실행되기 때문에 위에 있는 라우터가 응답하고 끝나버린다. 특정한 라우터에만 미들웨어를 적용시키고 싶다면 중간에 위치해도 된다.**

미들웨어는 그냥 next함수만 추가해주면 만들어진다. 생각보다 별 거 없다.

---

+ 잘못된 경로를 적었을 때에도 그 에러를 처리할 수 있는 미들웨어를 만들어본다. (응용)

.
.
.

app.get("/cats/d", (req, res) => {
  res.send({ d: Cat[3] });
});

app.use((req, res, next) => {
  console.log("this is error middleware");
  res.send({ error: "404 not found error" });
});

app.listen(8000, () => {
  console.log("server is on..");
});

 

이런 식으로 맨 하단에 두어 적절한 라우터를 찾지 못했을 때 에러를 나타내는 미들웨어에 도달하고 그에 대한 값을 반환한다.