Database connection error with nodejs and xampp mysql-CodePudding

So ive been trying to make a login form using nodejs and xampp mysql but after entering details from the table and clicking on login button the page keeps loading and nothing happens.... i cant quite figure it out.. This is how my directory looks.

My html code is:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Krishi Mitra Admin Login</title>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Exo:wght@200&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="/assets/css/logstyle.css">
    <script src="assets/js/logmain.js"></script>
</head>

<body>
    <section>
        <div >
            <img src="assets/imgs/bg.jpg">
        </div>
        <div >
            <div >
                <h2>Login</h2>
                <form action="/" method="post">
                    <div >
                        <span>Username</span>
                        <input type="text" id="username">
                    </div>
                    <div >
                        <span>Password</span>
                        <input type="password" id="password">
                    </div>
                    <div >
                        <div >
                            <input type="submit" value="Sign In">
                        </div>
                    </div>
                    <span id="error"></span>
                </form>
            </div>
        </div>
    </section>
</body>

</html>

and app.js file is:

const express = require('express')
const bodyParser = require('body-parser')
const mysql = require('mysql')
var path = require('path')
const app = express()
const port = process.env.PORT || 3306;


app.use(bodyParser.urlencoded({ extended: false }))


app.use(bodyParser.json())


const connection  = mysql.createConnection({
    host            : 'localhost',
    user            : 'root',
    password        : '',
    database        : 'nodejs'
})
   
connection.connect(function(error){
    if (error) throw error
    else console.log("connected to the database successfully!")
});


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

app.post("/", function(req,res){
    var username = req.body.username;
    var password = req.body.password;

    connection.query("select * from loginuser where user_name = ? and user_pass = ?",[username,password],function(error,results,fields){
        if (results.length > 0) {
            res.redirect("/dash.html");
        } else {
            res.redirect("/");
        }
        res.end();
    })
})


app.get("/welcome",function(req,res){
    res.sendFile(__dirname   "/dash.html")
})



app.listen(port, () => console.log(`Listening on port ${port}`))

I tried running xampp server using the admin panel on port 3306 but it wont let the node file run and shows the error that port is already in use..

I want this to open the dash.html file after login

CodePudding user response：

The problem with your current setup is that you're telling your node server to listen for incoming connections on port 3306, and you're using that same port to try and connect to the database.

Change your app.js code like this, and it should work.

... // rest of the code
const port = process.env.PORT || 1234; // or any port not already in use

.... // rest of your code
const connection  = mysql.createConnection({
    host            : 'localhost',
    user            : 'root',
    password        : '',
    database        : 'nodejs',
    port            : 3306     // <== add the port for database connection
})

For this to work, you should have Xampp in the background, running the MySQL module on port 3306. Of course, if you change your port in Xampp (for whatever reason), you'd need to change it in your app.js file as well.