How to send parameters from a form using Express and Node.js

Question

Sorry for the English, i am Brazilian and I do not know how to write very well.

I am trying to send by post the data of a form using Express:

index.html

<form action="insert" method="post">
            <p><h4> Title </h4>   <input type="text" name="title" id="title" size="40" maxlength="30" placeholder="Name of task"/> </p> 

            <p><h4>Description</h4> <textarea name="description" id="description" cols="50" rows="3" placeholder="description of task"></textarea> </p> 

            <p> 
                <h4>Grade</h4>
                <input type="radio" name="urgency" value="2"> 2
                <input type="radio" name="urgency" value="1" checked> 1
                <input type="radio" name="urgency" value="0"> 0
            </p>

            <p> 
                <h4>How?</h4>
                <select name="taskType" id="select"> 
                    <option value="2"> N* </option> 
                    <option value="1"> Hour </option> 
                    <option value="0"> Minute </option> 
                </select>
                <input type="text" name="repeats" id="options" size="40" maxlength="5" placeholder="NX?"/> </p> 
            </p>

            <p><button type="submit"> Submit </button></p>
        </form>

app.js

const express = require('express');
const bodyParser = require('body-parser');
const mysql = require('mysql');
const app = express();
app.use(bodyParser.urlencoded({ extended: true }))


const db = mysql.createConnection({
        host     : 'localhost',
        user     : 'root',
        password : '',
        database : 'metas'
});

db.connect( (err)  => {
        if(err) throw err;
        console.log('MySQL conected...');
});

app.get('/select', (req, res) => {
        let sql = "SELECT * FROM tasks";
        db.query(sql, (err, result) => {
                if(err) throw err;
                res.send(result);
        })
})

app.post('/insert', (req, res) => {
        let post = 
                {title: req.body.title, 
                description: req.body.description, 
                grau: req.body.urgency, 
                tipoRealizacao: req.body.taskType, 
                repeticoes: req.body.repeats
                }
        let sql = 'INSERT INTO tasks SET ?';
        let query = db.query(sql, post, (err, result) => {
                if(err) throw err;
                res.send("Post added");
        })
})


app.listen('3000', () => { console.log("Server initiated") } );

I am using mysql to store tasks, moreover I am using wampp on port 3306, but when I submit the form I have the error:

Not Found

The requested URL /MetaSite/public/insert was not found on this server.

Apache/2.4.35 (Win64) PHP/7.2.10 Server at localhost Port 80

index.html is in public folder and app.js in src.

Can anyone help me please? I do not know what I am doing wrong. Thank you.

Answer 1

It doesn't look like, based on your code, that your index.html is being hosted by the server javascript. In order for express to be able to handle a post request from that file, the file needs to be referenced and hosted by express. If this is what you are doing and you are just not showing it in your code please tell me but otherwise, this looks like your problem. The way you should do this is:

var path = require('path');

app.get('/', function(req, res) {
    res.sendFile(path.join(__dirname + 'public/index.html'));
});

to host the index file at http://localhost:3000/ .