20230629

뿌링클 치즈맛·2023년 7월 1일
0

Elice AI트랙 8기

목록 보기
25/28

Middleware

Express.js 동작의 핵심!
HTTP 요청과 응답 사이에서 단계별 동작을 수행해주는 함수.
Express.js의 미들웨어는 HTTP 요청이 들어온 순간부터 시작됨
미들웨어는 HTTP 요청과 응답 객체를 처리하거나, 다음 미들웨어를 실행할 수 있음
HTTP 응답이 마무리될 때까지 미들웨어 동작 사이클이 실행된다. HTTP응답을 전송하면서 미들웨어 동작은 마무리된다.

Middleware 작성법

req(HTTP 요청을 처리하는 객체), res(HTTP 응답을 처리하는 객체), next(다음 미들웨어를 실행하는 함수)를 가진 함수를 작성하면 해당 함수는 미들웨어로 동작할 수 있다.

const logger = (req, res, next) => {
	console.log(`Request ${req.path}`);
	next();
}

req, res, next를 인자로 갖는 함수를 작성하면 미들웨어가 된다.
req, res 객체를 통해 HTTP 요청과 응답을 처리하거나 next 함수를 통해 다음 미들웨어를 호출해야 하고, next() 함수가 호출되지 않으면
미들웨어 사이클이 멈추고 HTTP요청/응답이 제대로 처리되지 않기 때문에 주의해야 한다!

middleware 는 적용되는 위치에 따라서 어플리케이션 미들웨어, 라우터 미들웨어, 오류처리 미들웨어로 분류 할 수 있다.
필요한 동작 방식에 따라 미들웨어를 적용할 위치를 결정한다.

1. 어플리케이션 미들웨어

const auth = (req, res, next) => {
	if (!isAdmin(req)) {
		next(new Error('Not Authorized'));
		return;
    }
	next();
}

app.use((req, res, next) => {
	console.log(`Request ${req.path}`);
	next(); //1
});
app.use(auth); 
app.get('/', (req, res, next) => {
	res.send('Hello Express'); //2
});

1) 미들웨어 객체를 작성한 후 app.use로 연결.
2) HTTP 메서드인 get을 사용해 미들웨어를 연결했다.
위의 코드는 HTTP 요청이 들어온 순간부터 적용된 순서대로 동작 함

2. 라우터 미들웨어

router 객체에 미들웨어가 적용되는 것 외에는 1.어플리케이션 미들웨어와 사용방법이 같다. app 객체에 라우터가 적용된 이후로 순서대로 동작한다. 가장 우선은 app객체!

router.use(auth); //1
router.get('/', (req, res, next) => { //2
	res.send('Hello Router');
});
app.use((req, res, next) => { //3
	console.log(`Request ${req.path}`);
	next();
});
app.use('/admin', router); //4

1,2번 코드로 router를 선언하고 연결했다. 하지만 이 라우터가 4번에서 /admin 이라는 path에 연결이 되어있기 때문에 요청이 들어왔을 때 3번의 어플리케이션 미들웨어가 먼저 실행될 것이고, 1,2번이 실행될 것이다.

3. 오류처리 미들웨어

오류처리 미들웨어는 일반적으로 가장 마지막에 위치하는 미들웨어.
다른 미들웨어들과는 달리 err, req, res, next 네 가지 인자를 가지며, 앞선 미들웨어에서 next 함수에 인자가 전달되면 실행된다.

app.use((req, res, next) => { //1 
	if (!isAdmin(req)) { //2
		next(new Error('Not Authorized')); //3
		return;
	}
	next(); //4
});
app.get('/', (req, res, next) => { //5
	res.send('Hello Express');
});
app.use((err, req, res, next) => { //6
	res.send('Error Occurred');
});

1번 코드로 !isAdmin(req)의 값이 거짓일 경우, next에 인자로 Error를 넘긴다. 원래대로라면 5번 코드가 실행되어야 하지만, next에 인자를 넘긴 경우에는 중간 미들웨어를 뛰어넘고 err를 인자로 받는 6번 오류처리 미들웨어가 실행된다.

4. 함수형 middleware

하나의 미들웨어를 작성하고, 작동 모드를 선택하면서 사용하고 싶을 경우에는 미들웨어를 함수형으로 작성하여 사용할 수 있다.

const auth = (memberType) => {
	return (req, res, next) => {
	if (!checkMember(req, memberType)) {
		next(new Error(`member not ${memberType}`));
		return;
	}
	next();
	}
}
app.use('/admin', auth('admin'), adminRouter);
app.use('/users', auth('member'), userRouter);

위 코드에서 auth 함수는 미들웨어를 반환하는 함수다. auth 함수 실행 시 미들웨어의 동작이 결정되는 방식 ${memberType}으로 작성된다. 하나의 로직으로 admin과 member에 동시에 적용할 수 있다.

REST API

REST 아키텍쳐를 준수하는 웹API. RESTful API라고 부르기도 한다.
REpresentational State Transfer
웹에서 자료를 전송하기 위한 표현 방법에 대한 아키텍처

Application Programming Interface
서비스나 프로그램 간에 미리 정해진 기능을 실행 할 수 있도록 하는 규약

REST API는 API의 동작을 HTTP method + 명사형 URL로 표현한다.
/posts 라는 URL은 '게시글'이라는 자원을 가리킨다고 할 때, GET- 가져오기, POST - 새로 만들기, PUT - 수정하기, DELETE - 삭제하기 의 HTTP method와 결합하여 API 동작을 정의하여야 함
app.get('/',(req,res,next)=>{})의 형태도 REST API라고 볼 수 있을 것 같다.

REST API URL의 자원은 복수형으로 표현되며, 하나의 자원에 대한 접근은 복수형 + 아이디를 통해 특정 자원에 접근한다.
/posts 는 '게시글 전체'를 칭하는 URL이라고 할 때, /posts/1 은 '1번 게시글'이라는 자원을 표현한다.

REST API는 URL을 통해 자원을 계층적으로 표현한다.
/users/1/posts 라는 URL은 '1번 유저의 게시글 전체'라는 자원을 나타낸다. users/1로 1번 유저를 선택하고 /posts로 1번 유저의 게시글 전체를 선택한다.

REST API는 REST 아키텍처를 준수하는 웹 API를 의미하며, URL을 통한 자원의 표현 방법과, HTTP method를 통한 API 동작의 정의 정도만 사용해도 훌륭한 REST API를 구현할 수 있다고 한다...

JSON

JavaScript Object Notation
자바스크립트에서 객체를 표현하는 표현식으로 시작했다.
데이터를 표현하는 방법이 단순하고 이해하기 쉬워서 웹 API에서 데이터를 전송할 때 표현식으로 주로 사용된다.

[
	{ name: 'cat', legs: 4 }, 
	{ name: 'chicken', legs: 2 },
]

웹 API는 기본적으로 데이터를 문자열로 전송하게 되는데, 어떤 객체를 웹 API를 통해서 문자열로 전달하기 위해 JSON을 사용한다.

JSON에서 Object는 { key: value }로 표현하고, value에는 어떤 값(JSON객체도)이라도 사용될 수 있다. 자바스크립트와 같다.
JSON에서 Array는 [item1, item2] 로 표현한다. item에 어떤 값(JSON객체도)이라도 사용될 수 있다. 자바스크립트와 같다.

MVC 패턴

MVC 패턴은 웹 서비스의 가장 대표적인 프로젝트 구성 패턴
프로젝트의 기능들을 어떻게 분리할지에 대한 하나의 구성 방법
Model - View - Controller를 구분하여 프로젝트 구조를 구성

Model

Model은 데이터에 접근하는 기능 또는 데이터 그 자체를 의미
데이터의 읽기, 쓰기는 Model을 통해서만 이루어지도록 구성

View

View는 데이터를 표현하는 기능을 의미
주로 Controller에 의해 데이터를 전달받고, 전달받은 데이터를 화면에 표시해주는 기능을 담당.

Controller

Controller는 Model을 통해 데이터에 접근해 처리 결과를 View로 전달하는 기능을 의미.
웹 서비스에선 주로 라우팅 함수가 해당 기능을 수행


const 뒤에 중괄호를 왜 써야하는지 그 이유가 딱히 나와있지 않아 찾아봤는데, 잘 정리해둔 글이 있어 첨부한다.

const {a}와 const b의 차이는?

profile
뿌링클 치즈맛

0개의 댓글