ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • RefactorExpress
    FE 2023. 6. 2. 19:49

    라우팅: 메서드와 url에 따라 분기(Routing)하기

    ➡️ 메서드와 url(/lower, /upper 등)로 분기점을 만드는 것을 라우팅(Routing)이라고 함

    클라이언트는 특정한 HTTP 요청 메서드(GET, POST 등)와 함께 서버의 특정 URI(또는 경로)로 HTTP 요청

    라우팅은 클라이언트의 요청에 해당하는 Endpoint에 따라 서버가 응답하는 방법을 결정함

     

    const requestHandler = (req, res) => {
      if(req.url === '/lower') {
        if (req.method === 'GET') {
          res.end(data)
        } else if (req.method === 'POST') {
          req.on('data', (req, res) => {
            // do something ...
          })
        }
      }
    }

    Node.js로 라우팅을 구현

     

    const router = express.Router()
    
    router.get('/lower', (req, res) => {
      res.send(data);
    })
    
    router.post('/lower', (req, res) => {
      // do something
    })

    Ecpress로 라우팅을 구현한 코드

     

     

    Middleware

    미들웨어(Middleware)는 요청에 필요한 기능을 더하거나 문제를 발견하고 걷어내는 것을 말하는데 express의 가장 큰 장점이라고 할 수 있다. 

     

    1. POST 요청 등에 포함된 body(payload)를 구조화할 때(쉽게 얻어내고자 할 때)

    let body = [];
    request.on('data', (chunk) => {
      body.push(chunk);
    }).on('end', () => {
      body = Buffer.concat(body).toString();
      // body 변수에는 문자열 형태로 payload가 담겨져 있습니다.
    });

    Node.js로 HTTP 요청 body를 받는 코드

     

    const jsonParser = express.json();
    
    // 생략
    app.post('/api/users', jsonParser, function (req, res) {
    
    })

    express.json()을 이용한 코드

     

    const jsonParser = express.json({strict: false});
    
    // 생략
    app.post('/api/users', jsonParser, function (req, res) {
    
    })

    리팩토링을 진행하다가 미들웨어 사용에 에러가 났을 때

     

     

    2. 모든 요청/응답에 CORS 헤더를 붙일 때

    const defaultCorsHeader = {
      'Access-Control-Allow-Origin': '*',
      'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
      'Access-Control-Allow-Headers': 'Content-Type, Accept',
      'Access-Control-Max-Age': 10
    };
    
    // 생략
    if (req.method === 'OPTIONS') {
      res.writeHead(200, defaultCorsHeader);
      res.end()
    }

    Node.js에 CORS를 적용하는 예시

    CORS에 헤더를 붙이려면 응답 객체에 writeHead 메서드를 이용한다.

     

     

    3. 모든 요청에 대해 url이나 메서드를 확인할 때

    미들웨어는 프로세스 중간에 관여하여 특정 역할을 수행함. 예를 들면 미들웨어 로거(logger)는 디버깅이나 서버관리에 console.log로 적절한 데이터나 정보를 출력하는데 응답할 결과를 만들어야한다면 사이사이에 로거를 삽입하여 데이터를 현재 데이터를 확인하거나 디버깅에 사용 가능하다.

    미들웨어의 구성

    endpoint는 / 이고 클라이언트로부터 GET 요청을 받았을 때 적용되는 미들웨어.

    const express = require('express');
    const app = express();
    
    const myLogger = function (req, res, next) {
      console.log('LOGGED');
      next();
    };
    
    app.use(myLogger);
    
    app.get('/', function (req, res) {
      res.send('Hello World!');
    });
    
    app.listen(3000);

     

    4. 요청 헤더에 사용자 인증 정보가 담겨있는지 확인할 때

    HTTP 요청에 토큰이 있는지, 이미 로그인한 사용자일 경우 성공이나 아닐 경우 에러를 보내는 미들웨어 예제이다.

    app.use((req, res, next) => {
      // 토큰이 있는지 확인, 없으면 받아줄 수 없음.
      if(req.headers.token){
        req.isLoggedIn = true;
        next();
      } else {
        res.status(400).send('invalid user')
      }
    })

    'FE' 카테고리의 다른 글

    my-agora-states-server  (0) 2023.06.07
    StatesAirline Server  (0) 2023.06.05
    CORS  (0) 2023.06.01
    StateAirline Client part-2  (0) 2023.05.31
    StateAirline Client part-1  (0) 2023.05.30
Designed by Tistory.