3. ExpressJS 기초
ExpressJs 소개
nodejs로 만들어진 web framework
http://expressjs.com/ 익스프레스는 노드JS에서 대표적인 웹프레임웍입니다. 아래 다섯가지 개념을 이해해야 제대로 사용할수 있다..
1. 어플리케이션
2. 미들웨어 ( : 함수들의 배열/ express에 기능을 추가 할 때 이용 )
3. 라우팅 ( : path마다의 구성을 체계적으로 관리 )
4. 요청객체
5. 응답객체
하나씩 차근차근 살펴 보도록 하자.
( express 모듈을 설치하자 )
1. Application
- express 객체(instance)를 application 이라고 한다.
- 서버에 필요한 기능인 middleware를 어플리케이션에 추가한다.
- 라우팅 설정 가능
- 서버를 요청 대기 상태로 만들 수 있다.
const express = require('express')
const app = express
// 서버를 요청 대기상태로 만듬. (listen 메서드 : 요청대기)
app.listen(3000, () => {
console.log('Server is running')
})2. MiddleWare
- 함수들의 연속
- 로깅 middleware를 만들어보자.
const express = require('express')
const app = express()
// 1. 미들웨어 생성
// 미들웨어 생성시에는 인자가 3개.
function logger(req, res, next) {
consol.log('i am logger')
next();
}
// 2 . 미들웨어 추가시 use()쓴다.
// 추가할 미들웨어를 (괄호) 안에 쓴다.
app.use(logger)
app.listen(3000, () => {
console.log('Server is running')
})A. MiddleWare의 실행순서
- 로깅 middleWare2를 만들어, 실행 순서를 보자.
1) 미들웨어 생성.
function logger2(req, res, next) {
console.log('i am logger2')
next()
}- app.use(loger) 밑에 추가.
app.use(logger2);
2) Client가 요청.
$ curl -X GET 'localhost:3000' -v
< 결과 >
- git bash 콘솔
- vs코드 bash 콘솔
☞ 첫 번째 콘솔처럼 미들웨어는 잘 실행했고, vs코드 bash 콘솔처럼 client가 요청한 정보도 응답을 잘 해줬다.
B. middleWare의 3번째 인자인 next 메서드의 중요성.
- next 메서드를 주석처리 후 실행.
const express = require('express')
const app = express()
// 미들웨어 생성시에는 인자가 3개.
function logger(req, res, next) {
console.log('i am logger')
// next();
}
function logger2(req, res, next) {
console.log('i am logger2')
next()
}
// 미들웨어 추가시 use()쓴다.
// 추가할 미들웨어를 (괄호) 안에 쓴다.
app.use(logger)
app.use(logger2);
app.listen(3000, () => {
console.log('Server is running')
})< 결과 >
-
1) git bash 콘솔
-
2) vs코드 bash 콘솔
☞ 1)에서는 client가 요청에 대한 응답을 마저 받지 못했고,
2)에서는 logger2가 실행이 안 됬다.
이는 logger 미들웨어가 본연의 기능을 다 하고 next메서드가 없어, 다음으로 넘어가지 못 해서 생긴 일이다.
C. 다른 개발자가 만든 middleWare 사용(thiredParty Module)
순서
- npm install [thiredParty Module]
- require('[thiredParty Module]') 로 가져오기.
- 가져온 모듈을 변수에 넣고, (const thridPary=~)
- app 객체의 use메서드로 사용 ; app.use(thirdParty)
1) morgan 모듈 설치 ( npm 사이트 참조)
2) 코드 넣기
const morgan = require('morgan')
app.use(morgan('dev'))
3) 콘솔로 실행 & 결과 화면
a) curl로 client 요청하기.
b) 콘솔에 출력
D. Error 미들웨어
- 지금까지는 일반 middleWare 사용함.
- Error 미들웨어는 parameter를 4개 받는다.
< 전체 코드 >
const express = require('express')
const app = express()
function commonMW(req, res, next) {
console.log('This is commonMW')
next(new Error('error ouccered'))
}
function errormw(err, req, res, next) {
console.log(err.message)
next();
}
app.use(commonMW);
app.use(errormw);
app.listen(3000, () => {
console.log('Server is running')
})< 코드 해석 >
1. 일반 MiddleWare : 매개 인자가 3개
function commonMW(req, res, next) {
console.log('This is commonMW')
next(new Error('error ouccered'))
}에서.
next(new Error('error ouccered')) : error 발생 ==> next 함수에 Err객체를 던져준다.
- Err 미들웨어 : 인자가 4개
function errormw(err, req, res, next) {
console.log(err.message)
next();
}: 1) 이 전 middleWare에서 넘겨 준 err객체를 err 파라미터에 값을 넘긴다.
2) 코드 실행부분 ( console.log(err.message) )
: 전달받은 error를 처리 하거나,
처리 못했으면 다음 middleWare 로 넘김
3) next()
: 여기에서는 Error를 처리 했다고 치고, next를 넘긴다.
출력 화면.
- curl 로 client가 요청
$ curl -X GET 'localhost:3000' -v
- 콘솔
실행 순서
- app.use(commonMW) 실행 => console.log('This is commonMW')
- next(new Error('error ouccered')) 로, Err 미들웨어로 Err 객체가 전달.
- app.use(errormw) 실행 => 2의 Err객체를 function errormw(err, req, res, next)에서 첫 번째 Err 인자가 받음.
- console.log(err.message) 실행
- next(); 다음 미들웨어 실행
3. 라우팅
• 요청 url에 대해 적절한 핸들러 함수로 연결해 주는 기능을
라우팅이라고 부른다.
( *cf_ node의 http모듈을 사용하여, 서버를 생성하고 if문으로 url의 각각의 path마다 실행할 화면을 분기했다. 그 것이 바로 라우팅.)
• 어플리케이션 객체의 get(), post() 메소드로 구현할 수 있다
• 라우팅을 위한 전용 Router 클래스를 사용할 수도 있다
4. 요청 객체
- 클라이언트 요청 정보를 담은 객체를 요청(Request)객체라
고 한다
• http 모듈의 request 객체를 래핑한 것이다
• req.params(), req.query(), req.body() 메소드를 주로 사용 한다 ==> request로부터 요청 정보를 쉽게 사용 가능.
5. 응답 객체
- 클라이언트 응답 정보를 담은 객체를 응답(Response)객체
라고 한다
• http 모듈의 response 객체를 래핑한 것이다
• res.send(), res.status(), res.json() 메소드를 주로 사용한다
6. Express로 되어있는 Hello world 코드.
http://expressjs.com/ko/starter/hello-world.html
const express = require('express')
// express모듈 가져옴
const app = express()
// express 객체를 만들어, app 변수에 할당.
const port = 3000
app.get('/', (req, res) => {
res.send('Hello World!')
// send : 문자열을 출력하는 메서드
})
app.listen(port, () => {
console.log(`Example app listening at http://localhost:${port}`)
// 서버가 요청대기 상태에 들어가면 콘솔창에 출력됨.
})< 결과 >
