37일차

JiHun·2023년 6월 2일

부트캠프

목록 보기
33/56

Express

Express는 Node.js 환경에서 웹 서버, 또 API 서버를 제작하기 위해 사용되는 인기 있는 프레임워크다.

Express와 Node.js의 Http 모듈의 차이점

  • Express는 미들웨어를 추가할 수 있다.
  • 라우터를 제공한다.

기본 뼈대

const express = require('express')
const app = express()    // app은 express의 인스턴스
const port = 3000

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})
  • 앱은 서버를 시작하며 3000번 포트에서 연결을 청취한다.
  • 루트 URL 또는 라우트에 대한 요청에 "Hello World!"로 응답한다.
  • 다른 모든 경로에 대해서는 404 Not Found로 응답한다.

라우팅

Express 프레임워크 자체에서 라우터 기능을 제공한다.
특정 엔트 포인트에 대한 클라이언트 요청에 애플리케이션이 응답하는 방법을 결정한다.

app.METHOD(PATH, HANDLER)

PATH는 서버에서의 경로
HANDLER는 라우터가 일치할 때 실행하는 함수.

const router = express.Router()

router.get('/', function(req, res) {
	res.send('Birds home page');
});

router.get('/about', function(req, res) {
  	res.send('About birds');
});
  
router.post('/', function(req,res) {
  	res.send("Accept");
});

안에 있는 콜백 함수도 핸들러 함수이기 때문에 표현식으로 나타내고 깔끔하게 적을 수 있다.

router.get('/', HomeHandler);

const HomeHandler = function() {
	res.send("Birds home page")
}

미들웨어 (Middleware)

애플리케이션과 서버 또는 프레임워크 간의 통신을 도와주는 소프트웨어 구성요소다. 간단하게 말하자면 애플리케이션의 요청과 응답 사이에서 동작한다.
app.use를 이용해 미들웨어를 설정할 수 있다.

1. POST 요청에 포함된 body 구조화

Node.js http 모듈을 썼을 때는 조금 복잡한 방식을 썼었다.

let body = [];
request.on('data', (chunk) => {
	body.push(chunk);
}).on('end', () => {
	body = Buffer.concat(body).toString();
})

Express 내장 미들웨어인 express.json()을 사용하면 된다.

const jsonParser = express.json();

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

이렇게 각 라우터에 설정을 해줘도 되지만, 전역적으로 설정해줄 수 있다.

app.use(express.json())

use 메서드를 이용해서 미들웨어를 설정할 수 있다. 모든 요청에 대해 express.json() 처리를 하는 것이다.

2. CORS 헤더 처리

http 모듈에서는 모든 곳에 CORS 처리를 일일히 넣어줬었다.

if(req.method === "OPTIONS") {
	res.writeHead(200, {
		'Access-Control-Allow-Origin': '*',
		'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
		'Access-Control-Allow-Headers': 'Content-Type, Accept'})
	}

모든 응답처리에 CORS Header를 간단하게 설정해줄 수 있다.

cors 미들웨어를 사용해서 간단하게 만들 수 있다.

const cors = require('cors');

app.use(cors()); // 모든 요청에 대해 CORS 허용

app.get('/products/:id', cors(), function (req, res, next) {
  res.json({msg: 'This is CORS-enabled for a Single Route'})
})

3. 모든 요청에 대해 미들웨어 적용

app.use(function (req, res, next) {
  console.log('Time: %d', Date.now())
  next();
})  // 모든 요청을 이 use 미들웨어를 거쳐간다. 따라서 요청이 올때마다 console.log가 실행된다.

app.get('/', function (req, res) {
  res.send('Welcome')
})  // 라우터에 들어가지 않는 이상 이 응답은 실행되지 않는다. 즉, 설정된 라우터에만 실행된다.

4. 요청 헤더에 사용자 인증 정보 확인

app.use((req, res, next) => {
	if(req.headers.token) {
		req.isLoggedIn = true;
      	next();
    } else {
    	res.status(400).send('invalid user')
    }
})

미들웨어로 설정을 해준다. 만약 인증정보가 request에 token이 담겨서 오면 로그인 되었다고 설정할 수 있고 token이 없다면 에러를 띄울 수 있다.

참고

Express routing
https://expressjs.com/ko/guide/routing.html

Express app use
https://expressjs.com/ko/api.html#app.use

Express cors
https://expressjs.com/en/resources/middleware/cors.html

profile
안녕하세요. 프론트엔드 개발자 송지훈입니다.

0개의 댓글