Passport js, get user input using Handlebars

Question

I'm starting to learn node.js using passport, handlebars and mysql.

I want to create a signup page that will take email address, password, first name and last name. But on passport, it only takes the username and password.

passport.use('local-signup', new passportlocal.Strategy({
        // by default, local strategy uses username and password, we will override with email
        usernameField : 'email',
        passwordField : 'password',
        passReqToCallback : true // allows us to pass back the entire request to the callback
    },
function(req, email, password, done){
    connection.query("select * from userInfo where email = '"+email+"'", function(err, res){       
        if(err){
            console.error('error');
            // done(null, null);
            return done(null, false, { message: req.flash('error', 'Please fill your data correctly') });
            // return;
        }
        if (res.length) {
            console.log('user exist');
            return done(null, false, { message: req.flash('error', 'That email is already registered.') });
        }
        else{                
            // create the user
            var newUserMysql = new Object();
            newUserMysql.email = email;
            newUserMysql.password = password;
            newUserMysql.firstName = req.firstName;

            console.log(newUserMysql.firstName);

            var insertQuery = "INSERT INTO userInfo ( email, password, firstName ) values ('" + email +"','"+ password +"','"+ firstName +"')";

            connection.query(insertQuery,function(err,rows){
            newUserMysql.id = rows.insertId;

            // send mail with defined transport object
            app.locals.mailer.sendMail(mailOptions, function(error, info){
                if(error){
                    return console.log(error);
                }
                console.log('Message sent: ' + info.response);
            });

            return done(null, newUserMysql);
            }); 

        }
    })
}));

and following is the code for my handlebars

<div class="ui vertical stripe segment">
    <div class="ui text container">
        <form action="" method="post">

            {{#if message}}
            <div class="ui red message">{{message}}</div>
            {{/if}}

            <div class="content">
                <div class="field required">    
                    <label>Email Address</label>
                    <div class="ui fluid input">
                        <input type="text" name="email" placeholder="Email Address">
                    </div>
                </div>
            </div>  

            <p></p>

            <div class="content">
                <div class="field required">    
                    <label>Password</label>
                    <div class="ui fluid input">
                            <input type="password" name="password" placeholder="Password">
                    </div>
                </div>
            </div>  

            <p></p>

            <div class="content">
                <div class="field required">    
                    <label>Repeat Password</label>
                    <div class="ui fluid input">
                            <input type="password" name="repeatPassword" placeholder="Repeat Password">
                    </div>
                </div>
            </div>  

            <p></p>

            <div class="content">
                <div class="field required">    
                    <label>First Name</label>
                    <div class="ui fluid input">
                        <input type="text" name="firstName" placeholder="First Name">
                    </div>
                </div>
            </div>  

            <p></p>

            <div class="content">
                <div class="field required">    
                    <label>Last Name</label>
                    <div class="ui fluid input">
                        <input type="text" name="lastName" placeholder="Last Name">
                    </div>
                </div>
            </div>  

            <p></p>

            <div class="content">
                <div class="field required">    
                    <label>Phone Number</label>
                    <div class="ui fluid input">
                        <input type="text" name="phoneNum" placeholder="Phone Number">
                    </div>
                </div>
            </div>  

            <p></p>

            <button class="ui yellow button">Sign Up</button>

            <div class="ui horizontal divider">
                OR
            </div>

            Already have an account? Please <a href="/login" class="item">Login here!</a> 
        </form>
    </div>
</div>

I have tried the following solution, but it is not working for me.

I presume that my way of getting the input data from the handlebars to the passport is wrong, but I can't figure it out.

Thank you.

LocalStrategy only accepts username and password field in the callback, as you can acces the request object, you can acces the properties you want from the request body (req.body.firstName) as normal HTTP request. — Jose Hermosilla Rodrigo, Jun 13 '16 at 16:23
Sorry I didn't read the another question you post, but looking your code the first you need is to use req.body.firstName to acces firstName variable. Second, How are you sending the request? — Jose Hermosilla Rodrigo, Jun 13 '16 at 16:28
Hi @JoseHermosillaRodrigo , it works by adding the request body (req.body.firstName). Thanks for your help! — Timothy, Jun 13 '16 at 17:00
You're wellcome!! The answer you post also have a good answer in which this is mentioned!! — Jose Hermosilla Rodrigo, Jun 13 '16 at 17:04

score 0 · Accepted Answer · answered Jun 13 '16 at 17:05

Figure it out with help from Jose, both statements should be added a (req.body.firstName)

 else{                
        // create the user
        var newUserMysql = new Object();
        newUserMysql.email = email;
        newUserMysql.password = password;
        newUserMysql.firstName = req.body.firstName;

        console.log(newUserMysql.firstName);

        var insertQuery = "INSERT INTO userInfo ( email, password, firstName ) values ('" + email +"','"+ password +"','"+ req.body.firstName +"')";

Passport js, get user input using Handlebars

1 Answers1