Node - Express 미들웨어 connect-flash

connect-flash

[ 상대적으로 중요도가 떨어지는 미들웨어 ]이다.

하지만 일회성 메시지들을 웹 브라우저에 나타낼때 좋다.

직접 설치해주어야 한다.

npm i connect-flash

connect-flash 미들웨어는 cookie-parser와 express-session을 사용하므로 이들보다는 뒤로 위치해야 한다.

app.js

var session = require('express-session');
var flash = require('connect-flash');
var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');
...
app.use(cookieParser('secret code'));
app.use(session({
  resave:false,
  saveUninitialized: false,
  secret:'secret code',
  cookie: {
    httpOnly:true,
    secure: false,
  },
}));
app.use(flash());
...

flash 미들웨어는 req 객체에 req.flash 메서드를 추가한다.

req.flash(키,값)으로 해당키에 값을 설정하고,

req.flsh(키)로 해당 키에 대한 값을 불러온다.

flash와 세션을 테스트하기 위해 임시로 라우터를 만들었다.

routes/users.js

var express = require('express');
var router = express.Router();
 
/* GET users listing. */
router.get('/', function(req, res, next) {
  res.send('respond with a resource');
});
 
router.get('/flash',function(req,res){
  req.session.message = '세션 메시지';
  req.flash('message', 'flash 메시지');
  res.redirect('/users/flash/result'); 
});
 
router.get('/flash/result', function(req,res){
  res.send(`${req.session.message} ${req.flash('message')}`);
});
 
module.exports = router;
 

/users/flash 라우터로 GET 요청을 보내면 서버에서는 세션과 flash에 메시지를 설정하고,

/user/flash/result 메시지로 리다이렉트한다.

첫 번째  /user/flash/result에는 세션 메시지와 flash메시지가 모두 보인다.

http://localhost:3000/users/flash/result  방문 화면

세션 메시지 flash 메시지

여기서 브라우저를 새로고침하면 [세션 메시지]는 보이는데 [flash 메시지]는 보이지 않는다.

flash메시지가 일회용이기 때문이다.

재방문

세션 메시지

일회성 메시지라는 성질을 이용하여 

로그인 에러나 회원가입 에러 같은 일회성 경고 메시지는 flash 미들웨어로 보내면 좋다.

출처 : node.js 교과서

connect-flash

【相対的に重要度が落ちるミドルウェア]である。

しかし、一回限りのメッセージをWebブラウザに表示するときもいい。

直接インストールヘジュオヤする。

npm i connect-flash

connect-flashミドルウェアはcookie-parserとexpress-sessionを使用するので、これらより後ろに位置しなければならない。

app.js

var  session  =  require（'express-session」）;
var  flash  =  require（'connect-flash」）;
var  indexRouter  =  require（'./routes/index」）;
var  usersRouter  =  require（'./routes/users」）;
...
app.use（cookieParser（「secret code」））;
app.use（session（{
  resave：false、
  saveUninitialized：  false、
  secret：「secret code」、
  cookie：{
    httpOnly：true、
    secure：  false、
  }、
}））;
app.use（flash（））;
...

flashミドルウェアはreqオブジェクトにreq.flashメソッドを追加する。

req.flash（キー、値）に対応するキーに値を設定し、

req.flsh（キー）に対応するキーの値を呼んでいます。

flashとセッションをテストするために、一時的に、ルータを作った。

routes / users.js

var  express  =  require（'express'）;
var  router  =  express.Router（）;
 
/ * GET users listing。* /
router.get（'/' 、  function（req、res、next）{
  res.send（「respond with a resource」）;
}）;
 
router.get（「/ flash」、function（req、res）{
  req.session.message  =  「セッションメッセージ」 ;
  req.flash（「message」、  「flashメッセージ」）;
  res.redirect（'/ users / flash / result」）; 
}）;
 
router.get（「/ flash / result」、  function（req、res）{
  res.send（ `$ {req.session.message} $ {req.flash（「message」）}`）;
}）;
 
module.exports  =  router;
 

/ users / flashルータでGETリクエストを送信するサーバーでは、セッションとflashにメッセージを設定し、

/ user / flash / resultメッセージにリダイレクトする。

最初の/ user / flash / resultには、セッションのメッセージとflashメッセージがすべて見られる。

http：// localhost：3000 / users / flash / result訪問画面

セッションメッセージflashメッセージ

ここで、ブラウザを更新すると、[セッションメッセージ]は見える [flashメッセージ]は見えない。

flashメッセージが使い捨てであるためである。

再訪問

セッションメッセージ

一回メッセージという性質を利用して 

ログインエラーや会員登録エラーのような一回限りの警告メッセージは、flashミドルウェアに送信良い。

出典：node.js教科書

connect-flash

[Middleware of relatively low importance].

However , it is good for displaying one-time messages in a web browser .

You have to install it yourself.

npm i connect-flash

The connect-flash middleware uses cookie-parser and express-session, so it should be located behind them.

app.js

var  session  =  require( 'express-session' );
var  flash  =  require( 'connect-flash' );
var  indexRouter =  require( './ routes  / index' );
var  usersRouter =  require( './ routes  / users' );
...
app.use(cookieParser( 'secret code' ));
app.use(session({
  resave: false ,
  saveUninitialized:  false ,
  secret: 'secret code' ,
  cookie: {
    httpOnly: true ,
    secure :  false ,
  },
}));
app.use(flash());
...

The flash middleware adds the req.flash method to the req object.

Set the value to the key with req.flash(key, value) ,

Req.flsh(key) loads the value for the key.

I created a temporary router to test the flash and session.

routes/users.js

var  express  =  require( 'express' );
var  router  =  express.Router();
 
/* GET users listing. */
router.get( '/' ,  function (req, res, next) {
  res.send( 'respond with a resource' );
});
 
router.get( '/flash' , function (req,res){
  req.session.message  =  'session message' ;
  req.flash( 'message' ,  'flash message' );
  res.redirect( '/users/flash/result' ); 
});
 
router.get( '/flash/result' ,  function (req,res){
  res.send(`${req.session.message} ${req.flash( 'message' )}`);
});
 
module.exports  =  router;
 

Sending a GET request to the /users/flash router, the server sets a message to the session and flash

Redirect to /user/flash/result message.

The first /user/flash/result shows both session messages and flash messages.

http://localhost:3000/users/flash/result landing screen

Session message flash message

When the browser is refreshed, [session message] is shown, but  [flash message] is not.

This is because flash messages are disposable .

Revisit

Session message

By using the property of a one-time message 

One-time warning messages such as login errors or membership registration errors can be sent to flash middleware.

Source: node.js textbook