I'm using Node with express and handlebars. I have a login form, and should display a login error message to a user. My code is as follows: Validation (using passport):
...
else if (password != user.password) {
return done(null, false, req.flash('message', 'Wrong password'));
...
In routes I got this:
app.post('/sign-in', passport.authenticate('local', {
successRedirect : '/', // redirect to the home page
failureRedirect : '/sign-in', // redirect back to the signup page if there is an error
failureFlash : true // allow flash messages
}));
Then to render my handlebars template,
app.get('/sign-in', function(req, res) {
res.render("signin.handlebars", {layout: 'users.handlebars', action: 'Sign in', message: req.flash('message'),
csrf: 'CSRF token goes here' });
})
Problem is, the flash message ain't shown as required when a wrong password is entered.
Edit: My express setup is:
app.engine('handlebars', handlebars.engine);
app.set('view engine', 'handlebars');
app.set('models', __dirname + '/models');
app.use(express.static(__dirname + '/public')); // set the static files location /public/img will be /img for users
app.use(cookieParser());
app.use(expressSession({secret:'somesecrettokenhere', resave: true,
saveUninitialized: true, }));
app.use(passport.initialize());
app.use(passport.session());
//app.use(session({ store: new RedisStore }));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(flash());
app.use(morgan("dev"));
app.disable('x-powered-by');
app.use(function(err, req, res, next) {
res.status(err.status || 500);
});
To implement flash messages in NodeJs with connect-flash module, you need to install the required dependencies using the command. Express: Required by the library connect-flash to run. Express-session: to create a session whenever a message is flashed, so that the user can be redirected to a particular page.
The express-flash module exposes getter and setter methods for a flash message of the form, { flash: { type: 'type', message: 'message' }} and depends on the express-session module. The method req. flash(type, message) sets the value of a new flash message and adds it to an array of messages of the same type.
HandleBars can be used to render web pages to the client side from data on the server-side. To use handlebars in express, we need to store HTML code into a . hbs extension in the 'views' folder in the source directory as hbs looks for the pages in the views folder.
I solved it btw like so: ...
if (!user) {
return done(null, false, {
message: 'The email you entered is incorrect'
});
... That encodes the message in JSON. Then in routes I got:
app.get('/sign-in', function(req, res) {
res.render("signin.handlebars", {layout: 'users.handlebars', action: 'Sign in', ***error: req.flash('error')***,
csrf: 'CSRF token goes here' });
})
Then in my handlebars template:
{{#if error}}
<div class="alert alert-danger">{{error}}</div>
{{/if}}
You need to add a global variable in your index.js
app.use((req, res, next)=>{
app.locals.success = req.flash('success')
next();
});
Then in your route you add the message
req.flash("success", "Your message");
Finally you .hbs
{{#if success}}
{{success}}
{{/if}}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With