Back Ground

Node - Express 미들웨어 connect-flash 본문

Javascript/Node.js

Node - Express 미들웨어 connect-flash

Back 2019. 2. 27. 05:48


connect-flash


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

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


직접 설치해주어야 한다.

npm i connect-flash


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




app.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
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,
    securefalse,
  },
}));
app.use(flash());
...
cs


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

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

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


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



routes/users.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
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;
 
cs


/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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
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());
...
cs


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

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

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


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



routes / users.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
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;
 
cs


/ 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

One
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
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 ,
    securefalse ,
  },
}));
app.use(flash());
...
cs


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

One
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
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;
 
cs


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

Comments