일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- object
- 게시판
- https://velog.io/@velopert/create-typescript-react-component
- http://jeonghwan-kim.github.io/dev/2019/06/25/react-ts.html
- 출처 : https://webdir.tistory.com/506
- toString
- 출처 : https://joshua1988.github.io/web-development/javascript/promise-for-beginners/
- Today
- Total
Back Ground
Node - Express 미들웨어 connect-flash 본문
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, 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
【相対的に重要度が落ちるミドルウェア]である。
しかし、一回限りのメッセージを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 , secure : false , }, })); 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
'Javascript > Node.js' 카테고리의 다른 글
Node - Event Loop (0) | 2019.03.01 |
---|---|
Node - Express [Router 객체로 라우팅 분리] (6) | 2019.02.27 |
Node - Express 미들웨어 express-session (0) | 2019.02.27 |
Node - Express 미들웨어 static (0) | 2019.02.27 |
Node - Express 미들웨어 body-parser (1) | 2019.02.26 |