Node.js로 Restful API Server 만들기(5)

지난글에 이어서 Express를 사용시 유용한 MiddleWare들에 대해 소개합니다.

 

Express.static

express.static은 Node.js를 간단한 웹서버로써 활용하기 위해 지정된 디렉토리의 HTML, CSS, JavaScript, 이미지 및 기타 자산과 같은  파일을 제공하는 미들웨어 기능입니다. 간단한 웹서버 용도로 사용하기 좋습니다. 만일 대용량 트래픽을 처리하는 웹서비스인 경우 Apache-WebServer 도입을 권고합니다.

 

Apach vs Express.Static(Node.js)

Express.static과 Apache 모두 파일컨텐츠를 빠르고 효율적으로 제공할 수 있습니다. 그러나 Apache는 캐싱 및 기타 성능 최적화를 보다 세밀하게 제어할 수 있으므로 트래픽이 매우 많은 사이트나 파일 크기가 큰 애플리케이션에 더 적합할 수 있습니다.

보안: express.static 및 Apache 모두 안전한 파일 서비스를 제공하도록 구성할 수 있습니다. 그러나 Apache는 더 긴 추적 기록과 더 큰 사용자 커뮤니티를 가지고 있으므로 경우에 따라 더 안전한 선택이 될 수 있습니다.

사용 용이성: express.static은 설정하고 실행하는 데 몇 줄의 코드만 있으면 되므로 구성 및 사용이 상대적으로 쉽습니다. 반면 Apache는 학습 곡선이 더 가파르고 최상의 성능과 보안을 얻기 위해 더 많은 구성과 유지 관리가 필요할 수 있습니다.

 

express.static 미들웨어 함수는 정적 파일을 제공할 루트 디렉토리를 지정하는 경로 매개변수를 사용합니다. 예를 들어 public이라는 디렉터리에서 정적 파일을 제공하려면 다음 코드를 사용할 수 있습니다.

 

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

app.use(express.static(path.join(__dirname, 'public')));

 

Express-Generator로 생성하면 위와같이 public디렉토리를 Static File Server Root로 지정합니다. Browser에서 아래와 같이 접속하면 Public디렉토리에 있는 파일컨텐츠를 제공합니다. (실수로 서버 코드를 Public디렉토리에 두지 않도록 합니다.)

 

http://localhost:3000/index.html

 

compression

 

compression 미들웨어는 서버에서 클라이언트로 전송되는 HTTP  Reponse를 압축하는 데 사용할 수 있는 기본 제공 미들웨어입니다. 네트워크를 통해 전송되는 데이터의 크기를 크게 줄일 수 있는 gzip 또는 deflate와 같은 여러 알고리즘 중 하나를 사용하여 응답 데이터를 압축하는 방식으로 작동합니다.

express-generator에서 기본으로 설치해주지 않기 때문에 별도로 설치해야 합니다. package.json파일에 아래와 같이 추가합니다.

 

{
  "name": "myapp",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "cookie-parser": "~1.4.4",
    "debug": "~2.6.9",
    "express": "~4.16.1",
    "http-errors": "~1.6.3",
    "jade": "~1.11.0",
    "morgan": "~1.9.1",
    "compression": "~1.7.4",
  }
}

 

npm install명령으로 compression 패키지를 설치합니다.

 

Express.js 애플리케이션에서 압축 미들웨어를 사용하려면 app.use() 메서드를 사용하여 미들웨어 기능으로 포함하기만 하면 됩니다.

 

const express = require('express');
const compression = require('compression');
const app = express();

// Use compression middleware
app.use(compression());

// Define a route handler
app.get('/data', (req, res) => {
  // Send some data as the response
  res.send('Some data');
});

// Start the server
app.listen(3000, () => {
  console.log('Server started on port 3000');
});

 

이제 서버에서 응답하는 데이터는 압축되어 클라이언트로 전송됩니다. 대용량의 데이터를 전달시 네트워크 트래픽을 줄여줄 수 있어 유용합니다. 단 서버측에 압축으로 인한 추가적인 오버헤드가 발생하기 때문에 트래픽비용과 오버헤드비용을 계산하여 사용하길 권합니다.

 

CORS

CORS는 Cross-Origin Resource Sharing의 약자로, 웹 페이지가 원래 페이지를 제공한 도메인이 아닌 다른 도메인에 요청하는 것을 방지하기 위해 웹 브라우저에서 구현된 보안 기능입니다. 웹 페이지가 출처 간 요청을 시도할 때 브라우저는 일반적으로 보안상의 이유로 요청을 차단합니다.

 

보통 Restful API Server는 부하 분산 및 모듈화를 위해 웹서버와 별도로 분리하는 경우가 많기 때문에 정작 PostMan에서 정상동작했지만 브라우져에서 Restful API호출을 하지 못하는 문제가 발생합니다.

 

Node.js에서 CORS 미들웨어는 Express.js 애플리케이션에 대한 원본 간 리소스 공유를 활성화하는 데 사용할 수 있는 패키지입니다. 다른 도메인의 요청이 서버의 리소스에 액세스할 수 있도록 HTTP 응답에 적절한 헤더를 설정하여 작동합니다.

 

Express.js 애플리케이션에서 CORS 미들웨어를 사용하려면 npm에서 cors 패키지를 설치한 다음 app.use() 메서드를 사용하여 미들웨어 기능으로 포함할 수 있습니다.

 

{
  "name": "myapp",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "start": "node ./bin/www"
  },
  "dependencies": {
    "cookie-parser": "~1.4.4",
    "debug": "~2.6.9",
    "express": "~4.16.1",
    "http-errors": "~1.6.3",
    "jade": "~1.11.0",
    "morgan": "~1.9.1",
    "compression": "~1.7.4",
    "cors" : "2.8.5"
  }
}

 

npm install명령으로 cor 패키지를 추가합니다.

 

app.js에 app.use()를 사용하여 cor패키지를 활성화 하면 됩니다.

 

const express = require('express');
const cors = require('cors');
const app = express();

// Use CORS middleware
app.use(cors());

// Define a route handler
app.get('/data', (req, res) => {
  // Send some data as the response
  res.send('Some data');
});

// Start the server
app.listen(3000, () => {
  console.log('Server started on port 3000');
});

 

PostMan을 통해 Reponse헤더를 체크해 보면 아래 헤더가 확인됩니다.

 

PostMan스크린 발췌

 

지금까지 소개드린 미들웨어의 기능을 직접 구현하려면 상단한 노력이 필요하지만 Express를 사용하면 단지 몇분내에 필요한 기능들을 구현할 수 있어 매우 유용합니다. 이상으로  "Node.js로 Restful API Server 만들기"시리즈를 마칩니다.

 

읽허주셔서 감사합니다.