Express / middleware / router

미들웨어

미들웨어라는 것은 세가지 파라미터를 받는 함수를 말한다.

next 인자는 통과시킬 때 사용한다.

 

 

 

 

< 공식문서 내용 >

미들웨어 함수는 요청 오브젝트(req), 응답 오브젝트 (res), 그리고 애플리케이션의 요청-응답 주기 중 그 다음의 미들웨어 함수 대한 액세스 권한을 갖는 함수입니다. 그 다음의 미들웨어 함수는 일반적으로 next라는 이름의 변수로 표시됩니다.

 

현재의 미들웨어 함수가 요청-응답 주기를 종료하지 않는 경우에는 next()를 호출하여 그 다음 미들웨어 함수에 제어를 전달해야 합니다. 그렇지 않으면 해당 요청은 정지된 채로 방치됩니다.

 

 

미들웨어는 세가지 인자를 받는 함수이다

 

 

 

 

< 사용 예시 >

인증이 되었는지 안되었는지,

어떤 특정한 request 가 왔다 하면 검증이라던지,

 

 

 

 

 

 

 

 

 

 

 

 

Controller

무조건 response 를 리턴해야 한다.

마지막 미들웨어라고 보면 된다.

컨트롤러는 마지막 미들웨어이기 때문에 next 인자가 필요 없다.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

app.use

전체에 미들웨어 함수를 걸고 싶다면 app.use 를 사용해서 구현하면 된다.

 

 

 

 

 

 

 

 

 

Error Control

 

 

 

< 공식문서 >

 

오류 처리 미들웨어에는 항상 4개의 인수가 필요합니다. 어떠한 함수를 오류 처리 미들웨어 함수로 식별하려면 4개의 인수를 제공해야 합니다. next 오브젝트를 사용할 필요는 없지만, 시그니처를 유지하기 위해 해당 오브젝트를 지정해야 합니다. 그렇지 않으면 next 오브젝트는 일반적인 미들웨어로 해석되어 오류 처리에 실패하게 됩니다.

 

 

 

 

 

 

 

 

 

 

 

라우터

 

< 공식문서 >

 

라우팅은 URI(또는 경로) 및 특정한 HTTP 요청 메소드(GET, POST 등)인 특정 엔드포인트에 대한 클라이언트 요청에 애플리케이션이 응답하는 방법을 결정하는 것을 말합니다.

 

각 라우트는 하나 이상의 핸들러 함수를 가질 수 있으며, 이러한 함수는 라우트가 일치할 때 실행됩니다.

라우트 정의에는 다음과 같은 구조가 필요합니다.

 

app.METHOD(PATH, HANDLER)

 

 

 

 

 

 

다음은 매우 기본적인 라우터 코드이다. 

 

var express = require('express');
var app = express();

// respond with "hello world" when a GET request is made to the homepage
app.get('/', function(req, res) {
  res.send('hello world');
});

 

 

 

 

 

 

2개 이상의 콜백 함수는 하나의 라우트를 처리할 수 있습니다 (next 오브젝트를 반드시 지정해야 함).

예를 들면 다음과 같습니다.

 

app.get('/example/b', function (req, res, next) {
  console.log('the response will be sent by the next function ...');
  next();
}, function (req, res) {
  res.send('Hello from B!');
});

 

 

 

 

 

 

 

하나의 콜백 함수 배열은 하나의 라우트를 처리할 수 있습니다.

예를 들면 다음과 같습니다.

 

var cb0 = function (req, res, next) {
  console.log('CB0');
  next();
}

var cb1 = function (req, res, next) {
  console.log('CB1');
  next();
}

var cb2 = function (req, res) {
  res.send('Hello from C!');
}

app.get('/example/c', [cb0, cb1, cb2]);

 

 

 

 

 

 

 

 

독립적인 함수와 함수 배열의 조합은 하나의 라우트를 처리할 수 있습니다. 예를 들면 다음과 같습니다.

 

var cb0 = function (req, res, next) {
  console.log('CB0');
  next();
}

var cb1 = function (req, res, next) {
  console.log('CB1');
  next();
}

app.get('/example/d', [cb0, cb1], function (req, res, next) {
  console.log('the response will be sent by the next function ...');
  next();
}, function (req, res) {
  res.send('Hello from D!');
});

 

 

 

 

 

 

 

메소드설명

res.download()	파일이 다운로드되도록 프롬프트합니다.
res.end()	응답 프로세스를 종료합니다.
res.json()	JSON 응답을 전송합니다.
res.jsonp()	JSONP 지원을 통해 JSON 응답을 전송합니다.
res.redirect()	요청의 경로를 재지정합니다.
res.render()	보기 템플리트를 렌더링합니다.
res.send()	다양한 유형의 응답을 전송합니다.
res.sendFile()	파일을 옥텟 스트림의 형태로 전송합니다.
res.sendStatus()	응답 상태 코드를 설정한 후 해당 코드를 문자열로 표현한 내용을 응답 본문으로서 전송합니다.

 

 

 

 

 

 

 

 

 

 

express.Router

express.Router 클래스를 사용하면 모듈식 마운팅 가능한 핸들러를 작성할 수 있습니다. 

Router 인스턴스는 완전한 미들웨어이자 라우팅 시스템이며, 따라서 “미니 앱(mini-app)”이라고 불리는 경우가 많습니다.

 

 

다음 예에서는 라우터를 모듈로서 작성하고, 라우터 모듈에서 미들웨어 함수를 로드하고, 몇몇 라우트를 정의하고, 기본 앱의 한 경로에 라우터 모듈을 마운트합니다.

 

var express = require('express');
var router = express.Router();

// middleware that is specific to this router
router.use(function timeLog(req, res, next) {
  console.log('Time: ', Date.now());
  next();
});
// define the home page route
router.get('/', function(req, res) {
  res.send('Birds home page');
});
// define the about route
router.get('/about', function(req, res) {
  res.send('About birds');
});

module.exports = router;

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

실습 정리

 

1. git init

2. 레포지토리 만듦

3. git romete add ~

4. npm init -y

혹은 readme 작성하고 npm init -y  를 하면 package.json 에서 descirpton 이 생성됨

5. yarn add -D typ...

6. yarn tsc --init

7. scripts 에 dev 수정

8. npx eslint --init

 

 

 

 

원래 npm init 하면 package.json 파일을 형성하는데, npm init -y 를 하면 모든 질문에 대해서 yes 를 하여 넘어갈 수 있다.

 

 

ts-node : Node.js 상에서 TypeScript Compiler를 통하지 않고도, 직접 TypeScript를 실행시키는 역할을 합니다.

 

tsconfig.json

TypeScript로 짜여진 코드를 JavaScript로 컴파일하는 옵션을 설정하는 파일입니다. TypeScript 컴파일은 tsc 라는 명령어를 사용합니다.
아래 커맨드로 tsconfig.json 파일을 생성합니다.

 

$ npx tsc --init

 

 

 

 

package.json

 

 "scripts": {
    "dev": "ts-node-dev src/index.ts"
  },

 

 

 

 

 

dependencies와 devDependencies의 차이는 다음과 같습니다.

 

• "dependencies": 프로덕션 환경에서 응용 프로그램에 필요한 패키지.
• "devDependencies": 로컬 개발 및 테스트에만 필요한 패키지.

 

프로젝트에 꼭 필요한 패키지만 dependancy로 설치하고, typescript나 eslint 등 빌드 파일 실행에 필요하지 않는 패키지는 devDependancy로 설치한다.

 

 

 

dependancy에 패키지 설치

 

yarn add <package-name>

 

 

 

devDependancy에 패키지 설치

yarn add -D 와 같다.

 

yarn add <package-name> --dev

 

 

 

 

 

 

tsconfig.json 파일은 다음과 같습니다.

 

{
  "compilerOptions": {
    "target": "es5", // 어떤 버전으로 컴파일할지 작성 
    "module": "commonjs", //어떤 모듈 방식으로 컴파일할지 설정
    "outDir": "./dist",	//컴파일 후 js 파일들이 생성되는 곳
    "rootDir": "./src",	//루트 폴더
    "strict": true,	//strict 옵션 활성화
    "moduleResolution": "node",	//모듈 해석 방법 설정: 'node' (Node.js)
    "esModuleInterop": true,
     "jsx": "react"
  }
}

 

 

 

터미널에 npx gitignore node -> .gitignore 파일 생성됨