NODE.JS/Express

Express - 미들웨어

두비_ 2022. 6. 16. 00:50
반응형

Express에서 미들웨어는 아주 중요한 부분이다

흔히 볼 수 있는 기능 중 하나가 있는데 로그인을 하지 않았을 때와 했을 때의 화면이 다르게 보이는 사이트가 종종 있다

대표적으로 로그인을 했을 때 추가적은 기능을 통해 사이트를 볼 수 있는 것과 같은 개념이다

router.get('/products' , (req, res) => {
    if(로그인이 안되어있으면 이동) res.redirect('/accounts/login');
    res.send('admin 이후 url')
});

router.get('/products' , (req, res) => {

    if(로그인이 안되어있으면 이동) res.redirect();

미들웨어를 만들고 호출하면 매번 반복적인 작업을 하지 않아도 된다

미들웨어 만들기

먼저 사용자가 어떤 URL을 호출했는지 console를 통해 확인할 수 있는 기능을 설치

npm install morgan

app.js 코드 추가

const logger = require('morgan');
// 미들웨어 셋팅
app.use( logger('dev') );

여기까지 추가 후 로컬사이트를 새로고침하면 터미널에 get 요청이 뜨게되면서 모니터링이 가능해진다

미들웨어 제작

미들웨어는 인자를 3개를 받는다  request , response , next

admin에 요청한다

function testMiddleware( req, res, next) {
    console.log('첫번째 미들웨어');
    next();
}

아래 router.get에 추가해줬다

router.get('/' , testMiddleware, (req, res) => {
    res.send('admin 이후 url')
})

URL을 호출하면 admin 이후 URL을 거쳐 보는 방식인데 중간에 testMiddleware를 넣어줬으니 testMiddleware를 거치고 제어권을 next에 넘기고 마지막에 내가 작성한 소스를 보여줘라 이런 형식이다

localhost:3000/admin/ 에서 새로고침하면 터미널에 첫번째 미들웨어가 뜨게된다

두번째 미들웨어를 만들어준다

function testMiddleware2( req, res, next) {
    console.log('두번째 미들웨어');
    next();
}
router.get('/' , testMiddleware, testMiddleware2, (req, res) => {
    res.send('admin 이후 url')
})

url/admin 을 들어갔을 때 testMiddleware를 거치고 제어권은 next로 넘어가고 다시 두번째 testMiddleware2로 넘어가고 next로 제어권이 넘어가고 마지막으로 admin 이후 url에 도착한다

실제 협업에서 쓰이는 방식으로 보면 꼭 로그인이 된 사람만 그 뒷부분인 로그인 이후 내용만 볼 수 있게 해야하니 이런느낌이다

function loginRequired(req,res,next) {
    if(로그인이 되어있지 않으면) {
        res.redirect(로그인창으로)
    }else {
        next();
    }
}
router.get('/',  loginRequired, (req, res) => {
    res.send('admin 이후 url')
})

URL 호출은 먼저  loginRequired로 간다

app.js로 돌아와서 아까 셋팅한 부분을보면 이녀석도 미들웨어에 포함된다

app.use( logger('dev') );

app.use 자체가 미들웨어다 아래 코드처럼 /admin 했을 때 뒤에 admin을 보여줘라 라는의미가 된다

app.use ( '/admin', admin );

 

여기까지가 하나씩 URL을 호출해서 넣는방식인데 꽤 비효율적이므로 한꺼번에 한 곳에 넣는 방법을 알아본다

function vipMiddleware(req,res,next) {
    console.log('최우선 미들웨어');
    next();
}

app.use ( '/admin',vipMiddleware, admin );

admin을 최우선으로 연결해주었다

그럼 우리가 여기서 지정한 경로대로 한다면 " / " 여기선 "최우선 미들웨어"가 뜨는게 맞다

router.get('/',  testMiddleware, testMiddleware2 , (req, res) => {
    res.send('admin 이후 url')
})