node.js: HTML form hangs after submit when inserting data into PostgreSQL database

Question

I have recently set up node.js using Express and I created a simple HTML form using Jade. The form is to insert the data in a PostgreSQL database. The problem is that when I press submit on the form, everything is inserted on the database, but the HTML form is just hanging/lingering, and at some point it stops with No data received, ERR_EMPTY_RESPONSE. Sometimes it also inserts the data twice. I guess this is because the server side does not return a response, but I cannot see how (I am new to node.js).

The form has action="add_device" which is routed to routes/add_device.js. add_device.js looks like this:

var express = require('express');
var router = express.Router();

router.get('/', function(request, response, next) {
    res.send('Nothing to see here. Move along.');
});

router.post('/', function(request, response, next) {
    var db      = require('../public/javascripts/db/insert');
    var result  = db.insertDevice(request, response);
    return result;
});

module.exports = router;

The insertDevice function in my db module looks like this (it is exported with module.exports):

// Insert new QA device. Data arriving as a request from a HTML form.
insertDevice: function (request, response) {

    // Input that is verified in the HTML form.
    // Convert to proper format for PostgreSQL query.
    var name        = '\'' + request.body.name          + '\'';
    var ip_address  = '\'' + request.body.ip_address    + '\'';
    var os          = '\'' + request.body.os            + '\'';

    // Input that needs to be verified. Prepare for PostgreSQL query.
    var mac_address;
    var os_version;
    request.body.mac_address == ""  ?   mac_address = 'NULL'    :   mac_address = '\'' + request.body.mac_address   + '\'';
    request.body.os_version == ""   ?   os_version  = 'NULL'    :   os_version  = '\'' + request.body.os_version    + '\'';

    var pg = require('pg');             // PostgreSQL module.
    var td = require('./table_data')    // Database constants.

    var client = new pg.Client(request.app.get('postgreConnection'));
    client.connect(function(err) {
        if (err) {
            return console.error('Could not connect to postgres', err);
        }

        var QUERY = "INSERT INTO " + td.QA_DEVICES.TABLE_NAME + "(" +
                    td.QA_DEVICES.COLUMN_NAME           + ", " +
                    td.QA_DEVICES.COLUMN_MAC_ADDRESS    + ", " +
                    td.QA_DEVICES.COLUMN_IP_ADDRESS     + ", " +
                    td.QA_DEVICES.COLUMN_OS             + ", " +
                    td.QA_DEVICES.COLUMN_OS_VERSION     + ") VALUES(" +
                    name        + ", " +
                    mac_address + ", " +
                    ip_address  + ", " +
                    os          + ", " +
                    os_version  + ");";

        client.query(QUERY, function (err, result) {
            if (err) {
                return console.error('Error running query: ' + QUERY, err);
            }

            console.log('Query performed: ' + QUERY);
            client.end();
        });
    });

}

The 'Query performed' is always logged to console and data inserted into the database, but the form is still hanging. My questions are:

Is it the lack of response from the server that makes the form hang?
How can I "send a response back" to the front end?
Is it possible to route the front end to another page after insertion into the database? What is the best practice?

Ezra Morse · Accepted Answer · 2015-04-28 07:55:59Z

1

Yes, your request is receiving no response, so it is hanging.
In order to send a response, you can either send a blind acknowledgement right when the request is received (that is not dependent upon the success of the query and may be bad practice), or you can send it in the callback.

client.query(QUERY, function (err, result) {
            if (err) {
                // response.json({status: 'error'});
                response.write('Error');
                return console.error('Error running query: ' + QUERY, err);
            } else {
  
                // You can send json here too
                // response.json({status: 'success'});
                response.write('Success');

            }

            console.log('Query performed: ' + QUERY);
            client.end();
        });

If you want to go to another page, simply parse the incoming response on the client side and do a redirect. Using json is a good way to carry this out. You can also do a response.redirect(url) on the server side too, instead of sending back data. Have fun

edited Apr 28, 2015 at 7:55

answered Apr 28, 2015 at 7:50

Ezra Morse

1311 silver badge4 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Krøllebølle Over a year ago

Yes, this makes sense. Thank you for a good answer with pointers to further good practice.

Collectives™ on Stack Overflow

node.js: HTML form hangs after submit when inserting data into PostgreSQL database

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related