7. 익스프레스 (1) - 미들웨어 [4] : static

 

 

 

 

 

앞서 작성했던 [app.js]를 이어서 살펴보겠습니다. 

 

[app.js]

 

const express =require('express');
const morgan = require('morgan');
const cookieParser = require('cookie-parser');
const session = require('express-session');
const dotenv = require('dotenv');
const path = require('path');

dotenv.config();
const app = express();
app.set('port', process.env.PORT || 3000);

app.use(morgan('dev'));
app.use('/', express.static(path.join(__dirname, 'public')));
app.use(express.json());
app.use(express.urlencoded( {extended: false} ));
app.use(cookieParser(process.env.COOKIE_SECRET));
app.use(session({
    resave: false,
    saveUninitialized: false,
    secret: process.env.COOKIE_SECRET,
    cookie: {
        httpOnly: true,
        secure: false,
    },
    name: 'session-cookie',
}));

app.use((req, res, next) => {
    console.log('모든 요청에 실행됨');
    next();
});

app.get('/', (req, res, next) => {
    console.log('GET / 요청에서만 실행됨');
    next();
}, (req, res) => {
    throw new Error('에러는 에러 처리용 미들웨어로 전달');
});

app.use((err, req, res, next) => {
    console.error(err);
    res.status(500).send(err.message);
});

app.listen(app.get('port'), () => {
    console.log(app.get('port'), '번 포트에서 대기');
});

 

 

static은 기본적으로 제공되는 미들웨어이기 때문에 설치 없이 express 객체 안에서 호출하여 사용이 가능합니다. static 미들웨어는 정적인 파일들을 제공하는 라우터 역할을 합니다. 이 설명이 잘 이해가 가지 않을 수 있는데, 예시와 함께 살펴보겠습니다. 

 

우선 static은 아래와 같은 원리로 사용하게 됩니다. 

 

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

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

 

 

코드를 자세하게 이해하기 복잡하다면, 일단 이렇게 이해합시다. 여기서 public은 '정적 파일들이 담기는 폴더를 의미합니다. 이럴 경우, 예를 들어 public/stylesheets/style.css 경로에 파일이 존재한다고 해보겠습니다. 그럼 url http://localhost:3000/stylesheets/style.css로 접근이 가능해집니다.실제 서버 경로에는 public이 존재하지만, 요청 주소에는 public이 들어가지 않습니다. 이를 통해서 서버와 요청 경로의 차이로 인해 외부인이 서버의 구조를 파악하는 것을 방해해 보안에 도움이 되죠.

 

또한 fs.readfile( )로 파일을 직접 읽어서 전송하지 않아도 됩니다. 정적 파일들을 알아서 제공해 주니까요. 만일 요청 경로에 파일이 존재하지 않는다면 알아서 next를 호출해 줍니다. 파일을 발견하면 반대로 응답으로 파일을 보낸 다음

, next를 호출하지 않기 때문에 다음 미들웨어가 실행되지 않습니다. 

 

 

 

(참고 아티클)

 

 

4. Node 기능 살펴보기 (2) - 모듈 사용하기 : __filename, __dirname

 

 

4. Node 기능 살펴보기 (4) - 노드 내장 모듈 3