TIL : Mini Node Server

1. Node.js

= Chrome V8 javascript 엔진으로 빌드된 javascript 런타임
(V8 : 자바스크립트를 기계어로 컴파일 해준다. / 런타임 : 자바스크립트가 구동중인 환경)

- 이벤트 기반의 non blocking 모델로 속도가 빠르다.
- 별도의 설치 없이 node 상에서 require('') 방식으로 쓸 수 있는 모듈이 있다.
ex) fs, http, url, path

const fs = require('fs');
const http = require('http');


fs.readFile('./something.json', (err, data) => {
  console.log(data);
})
http.get('http://localhost:5000/api', (res) => {
  console.log(res)
})

---

2. Mini Node Server

node.js의 내장 http 모듈을 사용해 웹 서버를 만드는 스프린트를 진행했다. http 모듈은 HTTP 요청, 응답을 다룬다. 아래의 문서를 참고하며 버튼을 클릭함에 따라 각기 다른 요청을 보내며, 각각 보낸 단어를 소문자 또는 대문자로 바꾸는 기능을 실현시켰다. 서버 실행은 계속 node ~ 명령을 치지 않고 npm start에 nodemon으로 실행시켰다. nodemon을 이용하면 서버를 매번 실행시킬 필요가 없어 편리했다. nodemon 설치는 npm -g install nodemon으로 진행한다.

※ HTTP 트랜잭션 해부
nodejs.org/ko/docs/guides/anatomy-of-an-http-transaction/

const http = require('http');

const PORT = 5000;
const ip = 'localhost';

const server = http.createServer((request, response) => {
  const { headers, method, url } = request; // 요청이 들어올 때 처리할 프로퍼티
  
  if (request.method === 'OPTIONS') {
    // CORS 설정을 돌려줘야 한다.
    response.writeHead(200, defaultCorsHeader);
    response.end();
  }
  
  else if (request.method === 'POST' && request.url === '/upper') {
    // 대문자로 응답을 돌려줘야 한다.
    let body = [];
    request.on('data', (chunk) => {
      body.push(chunk);
    }).on('end', () => {
      body = Buffer.concat(body).toString();
      response.writeHead(200, defaultCorsHeader);
      response.end(body.toUpperCase());
    });
  }
  
  else if (request.method === 'POST' && request.url === '/lower') {
    // 소문자로 응답을 돌려줘야 한다.
    let body = [];
    request.on('data', (chunk) => {
      body.push(chunk);
    }).on('end', () => {
      body = Buffer.concat(body).toString();
      response.writeHead(200, defaultCorsHeader);
      response.end(body.toLowerCase());
    });
  }
  
  else {
    response.statusCode = 404;
    response.end();
  }

  console.log(
    `http request method is ${request.method}, url is ${request.url}`
  );
});

server.listen(PORT, ip, () => { // listen : 서버를 실행하고 클라이언트를 기다린다.
  console.log(`http server listen on ${ip}:${PORT}`);
});

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
};

---

3. 실제 실행 화면 👀

각각 버튼을 눌렀을 때 대문자, 소문자로 바뀌도록 성공적으로 기능을 구현했다. HTTP 모듈을 사용하는 방식을 익힐 수 있었다. 그리고 CORS 설정을 하는 메서드를 알 수 있었다. CORS(Cross Origin Resource Sharing)는 서로 다른 origin 간 HTTP request가 가능하도록 해주는 표준이다. OPTIONS 메서드로 CORS 설정을 했다.

좌 : 대문자 / 우 : 소문자