node.jsexpress

Cannot POST / error using express


I am trying to create a simple form handler using express. I tried the code below for my form:

<form class="form"  action="/" method="post" name="regForm">              
    <div class="form-group">
        <input type="text" name="username" class="form-control" id="username" placeholder="Username">
    </div>
    <button type="submit" class="btn btn-default">Submit</button>
</form>

And here is my app.js code:

const port = 3000;

var express = require('express'),
    app = express(),
    server = require('http').createServer(app);
var bodyParser = require('body-parser');

app.use(express.static(__dirname + '/public'));

app.use(bodyParser.urlencoded({
   extended: true;
}));

app.use(bodyParser.json());

app.post('/',function(req,res){
   var username = req.body.username;
   var html = 'Hello:' + username;
   res.send(html);
   console.log(html);
});

server.listen(port);

I keep getting the error "CANNOT POST /" after submitting the form. Am I missing something like a module?


Solution

  • You should try this way:

    const port = 3000;
    
    var express = require('express'),
        app = express();
    var bodyParser = require('body-parser');
    
    app.use(express.static(__dirname + '/public'));
    
    app.use(bodyParser.urlencoded({
       extended: false
    }));
    
    app.use(bodyParser.json());
    
    app.get('/', function(req, res){
      res.render('form');// if jade
      // You should use one of line depending on type of frontend you are with
      res.sendFile(__dirname + '/form.html'); //if html file is root directory
     res.sendFile("index.html"); //if html file is within public directory
    });
    
    app.post('/',function(req,res){
       var username = req.body.username;
       var htmlData = 'Hello:' + username;
       res.send(htmlData);
       console.log(htmlData);
    });
    
    app.listen(port);
    

    Things you should keep in mind for future Ref :

    1. You were extending url encode to true
    2. You were not having any get request for your form
    3. You were using HTML named variable which is one of bad practices