Nodejs Flash messages only loads after the page is refreshed (connect-flash) - node.js

Question

I'm getting stuck with connect-flash , all flash messages doesn't load on the page unless I refresh for a couple of times I'm not sure why.
I created a small project just to test connect-flash and it's the same result, please check the code below:
App.js code:
const express = require('express');
const path = require('path');
const favicon = require('serve-favicon');
const logger = require('morgan');
const cookieParser = require('cookie-parser');
const bodyParser = require('body-parser');
const session = require('express-session');
const flash = require('connect-flash');
const app = express();
// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'hbs');
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use(session({
secret: 'keyboard cat',
resave: false,
saveUninitialized: true
}));
//using flash
app.use(flash());
app.use(function(req, res, next){
res.locals.success = req.flash('success');
res.locals.error = req.flash('error');
next();
});
//flash route
app.get('/flash', (req, res) =>{
req.flash("success", "CONNECT FLASH TEST");
res.render('flash');
});
const port = process.env.PORT || 5000;
app.listen(port, () =>{
console.log(`App has started on port ${port}`);
})
Here's the code for the flash.hbs page to render the flash message:
<h1>Flash page</h1>
{‌{#if success}}
<h2>{‌{success}}</h2>
{‌{/if}}
Thanks so much in advanced, any help would be highly appreciated guys.

Answer 1

Do they render after just one refresh? That's how they are supposed to work.
"Flash messages" are used to carry a message over to the next request, and most of the time the only reason is the post-request-get pattern. If you just want to show a message to the user on the same page, while not doing a redirect, you don't need a library for it. Just pass the message to the template as data.

Answer 2

I was halfway through rolling my own new version of req.flash, when I was looking through the docs of express-session and came across this gem:
Note Since version 1.5.0, the cookie-parser middleware no longer needs to be used for this module to work. This module now directly reads and writes cookies on req/res. Using cookie-parser may result in issues if the secret is not the same between this module and cookie-parser.
And lo, I had these lines:
app.use(require('cookie-parser')())
const session = require('express-session')
const MongoStore = require('connect-mongo')(session)
app.use(session({
secret: process.env.SESSION_STORE_SECRET,
store: new MongoStore({mongooseConnection: mongoose.connection}),
maxAge: 10*365*24*60*60*1000, // set to 10 years
resave: false,
saveUninitialized: false
}))
Once I changed the cookie-parser line to:
app.use(require('cookie-parser')(process.env.SESSION_STORE_SECRET))`
it worked exactly as expected!
(For some people, the answer will be to remove cookie-parser altogether.)