static 미들웨어

김무연·2023년 12월 15일

Backend

목록 보기
38/49
post-thumbnail

정적인 파일들을 제공하는 미들웨어

  • 인수로 정적 파일의 경로를 제공
  • 파일이 있을 때 fs.readFile로 직접 읽을 필요 없음
  • 요청하는 파일이 없으면 알아서 next를 호출해 다음 미들웨어로 넘어감
  • 파일을 발견했다면 다음 미들웨어는 실행되지 않음
  • express에서 제공하는 미들웨어

app.use('요청 경로', express.static('실제 경로'));

app.use('/', express.tatic(__dirname, 'public-3030'));

컨텐츠 요청 주소와 실제 컨텐츠의 경로를 다르게 만들 수 있음

  • 요청 주소 localhost:3000/stylesheets/style.css
  • 실제 컨텐츠 경로 /public/stylesheets/style.css
  • 서버의 구조를 파악하기 어려워져서 보안에 도움이 됨

실습

아래와 같이 people.json이라는 정적 파일을 하나 만들어서 public위치에 만들어 두어, 주소에 public/people.json을 해보면

[
  {
    "name": "John Doe",
    "age": 43,
    "gender": "Male",
    "occupation": "Wokrer"
  },
  {
    "name": "Mira Jaeger",
    "age": 18,
    "gender": "Female",
    "occupation": "Student"
  },
  {
    "name": "Margaret C. Terjo",
    "age": 32,
    "gender": "Female",
    "occupation": "Teacher"
  },
  {
    "name": "Margaret C. Terjo",
    "age": 32,
    "gender": "Female",
    "occupation": "Teacher"
  },
  {
    "name": "Matthew J. South",
    "age": 45,
    "gender": "Male",
    "occupation": "Lawyer"
  },
  {
    "name": "Ramon H. Reed",
    "age": 35,
    "gender": "Male",
    "occupation": "Dentist"
  }
]

404 에러가 뜨는 것을 확인할 수 있다

서버에 위치한 모든 파일을 클라이언트에서 멋대로 조회할 수 있다면 원하지 않는 중요한 파일도 모두 노출되어 보안에 문제가 생길 수 있기 때문에 클라이언트에 공개할 파일을 특정 폴더에 모은 뒤, 그 폴더를 공개하는 작업이 반드시 필요한 것이다.

const express = require('express');

const app = express();

const path = require('path');
const publicPath = path.join(__dirname, 'public');
app.use(express.static(publicPath));

app.listen(3000, () => {
    console.log('server is running at 3000');
});

앞서 봤듯, path.join()은 플랫폼 별로 path의 구분자가 달라서 생기는 오류를 해결해주는 기능이고, __dirname은 코드를 실행한 디렉토리의 path를 담고 있는 변수다.

해당 path를 express.static() 미들웨어에 인자로 주고 app.use()로 미들웨어를 등록하면 /workspaces/node_workspace/static/public에 위치한 모든 파일을 클라이언트에서 조회할 수 있게 된다.

하지만 다시 GET /public/people.json 하면 여전히 404오류가 뜬다.

이유인 즉슨, main.js가 위치한 경로를 루트, /로 봤을 때는 /public/people.json이라는 경로가 맞지만, express.static에 public를 등록한 순간, 자동으로 public 디렉토리 내부에 접근하여 파일을 찾기 때문에 GET /public/people.json으로 접근하는 것은 GET /public/public/people.json에 접근하는 것과 동일한 결과를 얻게 된다.

우리가 찾는 json 파일은 /public/public/people.json이 아닌, /public/people.json이기 때문에 다음 경로로 접근하는 것이 옳다.

GET /people.json

실행이 잘 되는것을 확인할 수 있다.

또는

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

위의 /qqq 로 호출경로를 임의로 지정하여, 정적 파일을 제공할 주소를 지정할 수 있다. 그렇게 되면 /qqq 에 정적파일이 모여 파일을 호출하면 된다.

app.use('요청 경로', express.static('실제 경로'));

즉, '실제 경로'에 있는 파일들을 '요청 경로' 로 접근해 볼 수 있게 하는 것이다. 때문에 보안에 도움이 되는 것이다.

profile
Notion에 정리된 공부한 글을 옮겨오는 중입니다... (진행중)

0개의 댓글