[Node.js] Express.js 동작 방식

🎯 Express.js 동작 방식

📝 Express 동작시키기

• express-generator로 만들어진 프로젝트 디렉터리에 접근하여, npm start로 Express.js 프로젝트를 실행할 수 있다.
• localhost:3000에 접속하여 Welcome to Express 페이지를 확인할 수 있다.

 

📝 Express 동작 따라가기

1. 브라우저에서 localhost:3000 접속
2. app.js → app.use('/', indexRouter);
3. routes/index.js → router.get('/', ...
4. routes/index.js → res.render('index', ...
5. views/index.jade

 

📝 app.js

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

• app.js에서는 express()로 생성되는 app 객체를 확인할 수 있다.
• app 객체는 Express.js의 기능을 담은 객체이다.
• Express.js의 모든 동작은 app 객체에 정의된다.

 

📕 주요 기능

• app.use()
  • middleware를 사용하기 위한 함수이다.
• app.listen()
  • http 서버를 생성해주는 함수이다.
  • express-generator를 사용하면 http.createServer를 사용하는데 app.listen 함수로 대체할 수 있다.
• app.locals
  • app에서 사용할 공통 상수를 담을 수 있다.
  • Express.js 에선 global 변수를 선언하지 않고 이 값을 사용할 수 있다.

 

📝 라우팅

• 크게 app 라우팅과 Express.Router를 통한 라우팅으로 나누어진다.

app.get("/", (req, res) => {
  res.send("GET /");
});
app.post("/", (req, res) => {
  res.send("POST /");
});
app.put("/", (req, res) => {
  res.send("PUT /");
});
app.delete("/", (req, res) => {
  res.send("DELETE /");
});

// 어떤 요청이 들어와도 all url로 연결되어서 요청 처리
app.all("/all", (req, res) => {
  res.send("ANY /");
});

• app 객체에 직접 get, post, put, delete 함수를 사용하여 HTTP method로 라우팅 할 수 있다.
• HTTP method 함수의 첫 번째 인자가 이 라우팅을 실행할 URL이다.
• 마지막 인자가 이 라우팅이 실행될 때 작동하는 함수이다.
• all 함수를 사용하면 HTTP method에 상관없이 라우팅 가능하다.

 

📝 Express.Router

• app 라우팅을 통해서는 라우팅의 핵심인 그룹화를 지원하지 않는다.
• Express.Router를 통해 라우팅을 모듈화하고 그룹화하여 사용할 수 있다.

 

📕 Express.Router 모듈

const express = require("express"); // 로드
const router = express.Router(); // 함수형 모듈로 사용하여 객체 선언

router.get("/", (req, res, next) => {
  res.send("respond with a resource");
});

module.exports = router; // 라우터 사용

• router 객체에도 app 객체처럼 get, put, post, delete 함수를 사용할 수 있다.
• app의 함수와 동일한 동작을 하는 함수로 첫 번째 인자가 라우팅 될 URL이고, 마지막 인자가 라우팅 시 실행될 함수이다.
• 라우터는 일반적으로 모듈로 만들어서 사용한다.

 

📕 Express.Router 사용

// --- ./app.js
const express = require('express');
const userRouter = require("./routes/users");
const app = express();

app.get('/', (req, res) => {
    res.send("OK");
});

/* 라우터를 '/users' 경로에 연결 */
app.use("/users", userRouter); // ***
app.listen(8080);


//--- ./routes/users.js
const { Router } = require('express');
const petRouter = require("./pets");
const router = express.Router();

router.get('/', (req, res) => {
    res.send('GET /users');
});

// 1.
//router.use("/pets", petRouter);

// 2.
// /:userId/pets 경로에 petsRouter 연결
router.use('/:userId/pets', petsRouter)

module.exports = router;

//--- ./routes/pets.js
const { Router } = require('express');

const router = Router({ mergeParams: true });

/* GET 라우팅 추가 */ 
// 이미 pets 경로가 붙여진 상태로 들어온다.
router.get('/', (req, res) => {
    const { userId } = req.params;
    res.send(`Pets of user ${userId}`)
})

module.exports = router;

• 작성된 라우터 모듈을 app에 use함수로 연결하여 사용할 수 있다.
• router 객체에도 하위 라우터를 use 함수로 연결하여 사용할 수 있다.
• app.use('/경로 이름', 라우터 객체)
• 즉, /users에서 모든 처리를 하는데 /users/pets의 경로는 petRouter에서 처리하겠다!라는 의미이다.
• 계층적 구조의 라우터를 사용할 때, 라우터의 선언 시 Router({ mergeParams: true }) 를 사용해야, 이전 라우터에서 전달된 path parameter를 사용할 수 있다.

 

📝 라우팅 - path parameter 사용용

• Express.js 라우팅은 path parameter를 제공한다.
• path parameter를 사용하면,
  • /users/:id : /users/123, /users/456 등으로 접속했을 때 라우팅 적용
  • /messages/:from-:to : /message/123-456 등으로 접속했을 때 라우팅 적용
• 주소의 일부를 변수처럼 사용할 수 있다.

 

📝 Request Handler

• 라우팅에 적용되는 함수를 Request Handler라고 부름
• HTTP 요청과 응답을 다룰 수 있는 함수로 설정된 라우팅 경로에 해당하는 요청이 들어오면 Request Handler 함수가 실행된다.

router.get("/:id", (req, res) => {
  const id = req.params.id;
  res.send(`hello ${id}`);
});

// /say/ 뒤에 어떤 문자열이 오든지 해당 문자열을 응답으로 출력
const express = require('express');

const app = express();

app.get('/', (req, res) => {
    res.send("OK");
});

app.get('/say/:greeting', (req, res) => {
    const { greeting } = req.params;
    res.send(greeting);
});

app.listen(8080);

• router 나 app의 HTTP method 함수의 가장 마지막 인자로 전달되는 함수를 Request Handler라고 한다.
• 설정된 라우팅 경로에 해당하는 요청이 들어오면 Request Handler 함수가 실행된다.
• 요청을 확인하고, 응답을 보내는 역할을 한다.

 

📕 Request 객체

• HTTP 요청 정보를 가진 객체
• HTTP 요청의 path parameter, query parameter, body, header 등을 확인 가능
• req.params : URL 표현 중 /path/:id 에서 :id 를 req.params.id 로 사용할 수 있다.
• req.queries : URL 표현 중 /path? page=2에서 page 부분을 req.queries.page로 사용할 수 있다.
• req.body : 일반적으로 POST 요청의 요청 데이터를 담고 있다. req.body 에 요청 데이터가 저장되어 들어온다.
• req.get('') : HTTP Request의 헤더 값을 가져올 수 있다. req.get('Authorization') 등으로 값을 가져온다.

 

📕 Response 객체

• HTTP 응답을 처리하는 객체이다.
• HTTP 응답의 데이터를 전송하거나, 응답 상태 및 헤더를 설정할 수 있다.
• res.send() : text 형식의 HTTP 응답을 전송한다.
• res.json() : json 형식의 HTTP 응답을 전송한다.
• res.render() : HTML Template을 사용하여 화면을 전송한다.
• res.set() : HTTP 응답의 헤더를 설정한다.
• res.status() : HTTP 응답의 상태 값을 설정한다.

 

🏷 요약

• Express.js 는 app 객체를 시작으로 모든 동작이 이루어짐
• app 객체나 Express.Router를 사용하여 라우팅을 구현할 수 있음
• Request Handler를 통해 HTTP 요청과 응답을 처리할 수 있음