express-flash

우리는 protectMiddleware를 만들어서 예를들어 로그인 하지 않은 사용자가 upload하려하거나 하면 막아주는 기능을 만든 적이 있었다. 하지만 그 때 redirect를 해버리거나 if문을 사용하여 render할 때 errMessage를 보내고 pug에서 if errMessage 분기문을 만들어 표현하곤 했다. 이렇게 번거롭게 하기보다는 이제

express-flash 미들웨어를 사용하면 정말 간단하게 처리할 수 있다.

npm i express-flash

를 통해 설치해주고

server.js

import해주고

flash() 미들웨어를 설치한 순간부터 req.flash라는 함수를 사용할 수 있게된다. 그리고 req.flash('error', 'Not authorized')

처럼 사용하면 locals.messages 에 자동으로 담겨진다. 전에 우리가 로그인 했을 경우 pug에서 사용하기 위해서

res.locals에 loggedIn 을 true로 해두고 user의 정보를 담아둔 것처럼 flash에서 messages에 담아둔 것이다.

우리가 login 했을 때의 핸들러이다

req.flash()를 사용하여 messages locals에 이런 메시지를 넣어주면

이렇게 뜨는 것을 확인할 수 있다.

 

따라서 messages.error를 사용하면 Not authorized가 출력이 된다.  req.flash('info')로 설정해두었다면 messages.info로 해두면 된다. 따라서 모든 템플릿이 base.pug를 기본으로 사용하고 있으니까 base.pug의 맨 위에

if messages.error 

    span=messages.error

if messages.info

    span=messages.info

를 적어주면 출력이 된다.

우리는 이걸 mixin으로 만들어줄 것이다. 왜냐하면 각 kind마다 class를 다르게 하므로써 css를 다르게 주기 위해서이다!!

mixsins/message.pug

base.pug