In express.js, res.render() is not working

Question

I'm making a simple webapp with facebook login.

If the facebook login button on my page is clicked,

FB.api(
  '/me',
      'GET',
      {"fields":"id,name,birthday,gender"},
      function(response) {
        $.post('fb_login', response, "json");
      }
    );

is called, and a router handles '/fb_login' request; in the router the server checks the id of json object is already in its DB. If not, res.render('signup', ...) should be called. However it didn't work. I already checked that res.render() was called, but the page 'signup.jade' didn't show up.

Here is my source code of router.

var express = require('express');
var router = express.Router();
var mysql = require('mysql');
var pool = mysql.createPool({
    host: 'localhost',
    user: 'root',
    password: '1012'
});

/* GET home page. */
router.post('/', function(req, res, next) {
var userid = req.body.id;
if (userid) {
    pool.getConnection(function(err, connection) {
        if (err) {
            console.error('DB Connection error!!');
            return;
        }
        console.log('DB Connection Success!!');
        connection.query('use vasket');
        connection.query('select count(*) result from user where userID=?', 
        [userid], function(err, result, field) {
            var isAlreadyUser = result[0].result;
            console.log(isAlreadyUser);
            if (isAlreadyUser == 1) {
                req.session.userid = userid;
                res.redirect('/');
                res.end();
                console.log('DB FB Login Success!!');
                connection.release();
            }
            else {
                connection.release();
                console.log('FIRST TIME!');
                //This method was called, but the page rendered didn't 
                res.render('signup', {id: req.body.id, name: req.body.name, birthday: req.body.birthday, gender: req.body.gender});
            }
        });
    });
} else {
    res.redirect('/');
    res.end();
}

How can I fix it?

Answer 1

To help debugging maybe you can modify your code like that :

// ... your code before

            else {
                connection.release();
                console.log('FIRST TIME!');


                console.log(req.body);


                //This method was called, but the page rendered didn't 
                res.render(
                  'signup', 
                  {
                    id      : req.body.id, 
                    name    : req.body.name, 
                    birthday: req.body.birthday, 
                    gender  : req.body.gender
                  } ,
                  function(err, html){
                    if(err) console.log(err);

                    console.log(html);                        
                    //res.send(html);
                    // trying same but forcing status
                    res.status(200).send(html);
                  }
                );
            }
        });
    });
} else {
    res.redirect('/');
    res.end();
}

Answer 2

This is an older question, but it's still in need of a solid answer. I had the exact same problem, but I think I've figured it out.

If the server's returning the proper response, that's not where your problem lies. jQuery (in the browser) will render the response, but you have to tell it to do so.

Here's what I had that was responding properly but not rendering:

$("#getsome").click(function() {
    $.get("/task/create");
});

And here's how I got it to render:

$("#getsome").click(function() {
    $.get("/task/create", function( data ) {
        document.write(data);
    });
});

Note that you may not need to replace the entire DOM like I'm doing.

References:

• Replacing the entire DOM
• jQuery.get