express 미들웨어 작동원리이해하기

Refactor Express

javaScript 생태계에서 인기있는 프레임워크 MERN stack. (MongoDB, Express, React, Node)

이중 Express.js는 node.js환경에서

웹서버, 또는 API서버를 제작하기 위해 사용되는 가장 있기있는 프레임워크

npm install express framework (다시확인)

express로 구현한 서버가 http모듈로 작성한 서버보다 좋은점!

1. 미들웨어 추가가 편리 2. 자체 라우터 제공한다. (분기가능)

• 직관적인 코드로 사용가능하다

---

case1. 모든 요청에 대해 url이나 메소드를 확인 할 때,

//endpoint가`/`면서, 클라이언트로부터 GET요청을 받았을때 적용하는 미들웨어
app.get('/', funtion(req, res, next){
	next(); //다음미들웨어로 데이터를 전달해주는 함수
})
app.listen(3000);

//특정endpoint아닌, 모든 요청에 동일한 미들웨어를 적용하려면?! app.use()를 사용한다.
app.use(myLogger);

case2. POST요청 등에 포함된 body(payload)를 구조화할 때(쉽게얻고싶을때) Buffer(chunk)를받아 .toString() 으로 받았던 복잡한 방법 대신 express.json([options]) 를 사용하여 간단하게 해결할 수 있음.

app.use(express.json({ strict: false }));
app.use(express.urlencoded({extended: true}));
//생략
app.post("/lower", (req, res) => {
  req.body는 JSON의 형태로 payload가 담겨져 있습니다.
});

case3. 모든 요청/응답에 CORS 헤더를 붙여야 할 때

req.writeHead()메소드를 이용하여 CORS헤더를 붙여야 하며. 매번 'Access-Control-Allow-Origin':'*' 정의해야함. 또... OPTION메소드에 대한 라우팅도 따로 구현해줘야한다고.. 이귀찮은걸 CORS미들웨어로 간단하게 해결!

왼쪽에서 오른쪽방식으로 간단하게 해결됨!

case4. 요청 헤더에 사용자 인증 정보가 담겨있는지 확인할 때(Authentication)

app.use((req,res,next) => {
  //토큰있니? 없으면 받아줄 수 없어! (Token:주로사용자인증에사용됨)
  if(req.headers.token){
    req.isLoggeddIn = true;
    next()
  }else {
    res.status(400).send('인증되지않아서못들어가셔요')
  }
})

npm install cors

 

 

express 미들웨어 bodyparser (참고)

API 요청에서 받은 body 값을 파싱하는 역할을 수행하는 것이

bodyParser 라는 미들웨어이다.

(내가원하는 형식에 맞춰 해석하는 용도)구문해석: bodyparser , cookieParser, JSON.parse, JSON.stringify..등 파서의 종류다양!

POST, PUT요청 메소드의 request.body를 읽어오려면 bodyparser가 꼭 필요하다!

실제번역역할: compiler

미들웨어 없이req.body 에 접근하는 경우에는 기본으로undefined.

bodyParser, multer와 같은 미들웨어를 사용하여 요청 데이터 값에 접근해야한다.

//내장되어있다면 이렇게 쓸 수 있고
app.use(express.json()); 
app.use(express.urlencoded( {extended : false } ));

내장되어있지 않다면 npm i body-parser

Q. 얘는 무슨일을하는가?

urlencoded({ extended: false });

bodyParser 미들웨어의 여러 옵션 중에 하나로

false 값일 시 node.js에 기본으로 내장된 queryString,

(쿼리 문자열 모듈은 URL 쿼리 문자열을 구문 분석하고 형식을 지정하는 유틸리티를 제공.)

true 값일 시 따로 설치가 필요한 npm qs 라이브러리를 사용

(일부 보안이 추가된 쿼리 문자열 구문 분석 및 문자열 지정 라이브러리.)

queryString 과 qs 라이브러리 둘 다

url 쿼리 스트링을 파싱해주는 같은 맥락에 있으나

qs가 추가적인 보안이 가능한 말 그대로 extended 확장된 형태이다.

기본이 true 값이니 qs 모듈을 설치하지 않는다면

아래와 같이 false 값으로 따로 설정을 해주어야 한다.

 

---

express TEST 및 실습부분 리뷰

const express = require("express");
const app = express();
const router = express.Router();

const myLogger = function (req, res, next) {
  console.log("LOGGED"); // 이부분을 req, res수정하면 모든요청에 대한 로그 찍을 수 있음
  next(); //이게없으면 다음줄로 안넘어감.
};
app.use(myLogger);
//GET에 대한요청에 대한 응답
app.get("/", function (req, res) {
  res.send("Hello World 서버잘돌았엉");
});

// app.listen(3000);

module.exports.myLogger = myLogger;