미들웨어 (Middleware)

현채은·2023년 4월 5일

💡 미들웨어 (Middleware)

➡️ 애플리케이션에 들어오는 HTTP 요청들을 필터링하는데에 사용

요청(Request)에 필요한 기능을 더하거나, 잘못된 요청을 중간에서 걷어내는 역할
요청과 응답 중간에 위치하여 미들웨어라고 부른다
req, res, next가 매개변수인 함수
- req : 요청
- res : 응답 조작 가능
- next() 로 다음 미들 웨어로 넘어감
미들웨어 함수를 여러번 인자로 쓸 수 있음
express의 가장 큰 장점 ⭐️

자주 사용하는 미들웨어

1️⃣ . POST 요청등에 포함 된 body를 구조화 할 때 ( 쉽게 얻어내고자 할 때 )
2️⃣ . 모든 요청 & 응답에 CORS 헤더를 붙여야 할 때
3️⃣ . 모든 요청에 대해 url이나 method를 확인할 때
4️⃣ . 요청 헤더에 사용자 인증 정보가 담겨있는지 확인할 때

1️⃣ : POST 요청 등에 포함 된 body(payload)를 구조화 할 때

Node.js로 HTTP body를 받을 때는 Buffer를 조합해서 다소 복잡했음 ( Mini Node Server 과제 참조 )
네트워크상의 chunk를 합치고 buffer를 문자열로 변환하는 작업 필요했음

let body = [];
request.on('data' ,(chink) => {
  body.push(chunk);
}).on('end', () => {
  body = Buffer.concat(body).toString();
  // body 변수에 있는 buffer 데이터를 문자열로 변환
});

body-parser 미들웨어의 등장

npm install body-parser

[코드] npm으로 body-parser 설치

const bodyParser = require('body-parser');
const jsonParser = bodyParser.json();
// 생략
app.post('/users', jsonParser, function((req,res) {
// 헤더가 옵션과 일치하는 json 요청만 구문 분석하고 확인하는 미들웨어 반환
})

[코드] body-parser를 미들웨어를 이용한 코드

Express v4.16.0 부터는 body-parser를 따로 설치하지 않고, Express 내장 미들웨어인 express.json()을 사용

const jsonParser = express.json();

// 생략
app.post('/api/users', jsonParser, function (req, res) {

})

Mini-Node Server 리팩토링을 진행하다가 express.json() 미들웨어 사용에 에러가 난다면? express.json([options])의 options에 해답이 있다

const jsonParser = express.json({strict: false});

// 생략
app.post('/api/users', jsonParser, function (req, res) {

})

{strict: false} : 배열 및 개체 수락만 활성화(true) 또는 비활성화(false)합니다. 비활성화되면 모든 것을 허용

2️⃣ : 모든 요청/응답에 CORS 헤더를 붙일 때

Node.js HTTP 모듈을 이용한 코드에 CORS 헤더를 붙이려면 응답 객체 (res)의 writeHead 매서드를 이용할 수 있다.
Node.js 에서는 이 메서드 등을 이용하여 라우팅마다 헤더를 매번 넣어줘야함 🙀
게다가 OPTIONS 메서드에 대한 라우팅도 따로 구현해야 함
➡️ express에서 core 미들웨어를 사용하면 이 과정을 간단하게 처리할 수 있음

Node.js에 CORS를 적용

const defaultCorsHeader = {
  '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
};
// 생략
if(req.method === "OPTIONS") {
  res.writeHead(200, defaultCorsHeader); // 라우팅마다 매번 헤더를 넣어줘야함
  res.end()
}

cors 미들웨어를 사용하여 CORS 적용

npm install cors // npm 으로 cors 설치

모든 요청에 대해 CORS 허용

const cors = require('cors');
//생략
app.use(cors()) // 모든 요청에 CORS 적용 완료...

특정 요청에 대해 CORS 허용

const cors = require('cors');
// 생략
app.get('/product/:id', cors(), function(req, res, next) {
  res.json({msg : 'This is CORS-enabled for a Single Route'})
})