Connect HTML login/register Forms to work along with the server. (express, knex, postgres)

WEB DEVELOPMENT HELP on NODE.JS POST HTML form.
NOTE: on my postgresql database, I created Two tables. (users, and login) the users table contains the user's registered name, and email. The login table contains the user's email and password.

When I try to register a new user, it shows the new user on my database, but on the web page.. it displays after successful registration. OR when I enter wrong password or email when trying to login.

'unable to register'

Then I try to login with the wrong password, I just get a display on my console for password not matched. I want it to be displayed to the user the error password, and not just on my console. Here is a snapshot of what is on the console.

const express = require('express');  const app = express();  const path = require('path')  const bodyParser = require('body-parser');  const bcrypt=require('bcrypt-nodejs');  const cors = require('cors');  const knex = require('knex')    var session=require('express-session');  app.use(session({      secret:'cat',      resave:true,      saveUninitialized:true  }));  const db=knex({    client: 'pg',    connection: {      host : '127.0.0.1',      user : 'postgres',      password : 'test',      database : 'maklogin'    }  });      app.use(bodyParser.urlencoded({     extended: false  }));  app.use(bodyParser.json());    app.use(cors())    app.use(express.static(__dirname+"/public"));   app.get('/',(req, res)=>{      res.sendFile(path.join(__dirname+"/views/index.html"));   })    app.get("/about",(req,res)=>{    res.sendFile(path.join(__dirname+"/views/about.html"));  });  app.get("/notice",(req,res)=>{    res.sendFile(path.join(__dirname+"/views/notice.html"));  });    app.get("/login",(req,res)=>{    res.sendFile(path.join(__dirname+"/views/login.html"));  });      app.post("/login",(req,res)=>{      var password=req.body.password;      var email=req.body.email;      var error=[];      dbemail=db.select('email').from('users')                    .where('email', '=', req.body.email)                    .then(data=>{                        if(data){                          console.log('email matched');                        }else                        {                          error.push({msg:'email not matched'});                        }                    }).catch(err=>console.log(err));      db.select('hash').from('login')                 .where('email', '=', req.body.email)                 .then(result => {                              bcrypt.compare(password,result[0].hash,(err,result)=>{                              if(result){                              res.sendFile(path.join(__dirname+"/views/notice.html"));                                   }else{                                  error.push({msg:'password doesnt match'});                                  console.log('password doesnt match')                              }                      })      })      .catch(err => console.log(err));  })      app.get("/register",(req,res)=>{    res.sendFile(path.join(__dirname+"/views/register.html"));  });    app.post("/register",(req,res)=>{    const { email, name, password } = req.body;    const hash =bcrypt.hashSync(password);    db.transaction(trx => {      trx.insert({          hash: hash,          email: email      })      .into('users')      .returning('email')      .then(loginEmail =>{          return trx('login')          .returning('*')          .insert({              email: loginEmail[0],              name: name          })          .then(user => {              res.sendFile(path.join(__dirname+"/views/login.html"));          })      })      .then(trx.commit)      .catch(trx.rollback)    })    .catch(err => res.status(400).json('unable to register'))  })  app.listen(5000,console.log("Server started...."));  

And this is my HTML register form:

    <form name="myForm" onsubmit="return validateForm()" method="POST">          Full name <br><input type="text" name="name"required><br>          Password <br><input type="Password"name="password" required><br>          Email <br><input type="email"name="email" required><br>          <input type="submit" value="Register!">          <input type="reset"><br>          Already a User? <a href="Login.html">Login</a>          <script type="text/javascript" src="form.js"></script>      </form>      </div>  </body>  <script type="text/javascript">    function validateForm() {    var x = document.forms["myForm"]["username"].value;    if (x == "") {      alert("Name must be filled out");      return false;    }  }  </script>  </html>  

And this is my HTML login form:

    <form name="myForm" id="complete" method="POST">          Email <br><input type="email" id="mail" name="email" required><br>          Password <br><input type="Password" id="passw" name="password" required><br>          <input type="submit" name="login" value="Login">          <input type="reset"><br>          New to Soft Mak Finder? <a href="/Register">Register</a>      </form>    </div>  </body>  <script type="text/javascript">  var email=document.getElementById("mail");  var password=document.getElementById("passw");   document.getElementById("complete").submit();  </script>  </html>  

https://stackoverflow.com/questions/66407051/connect-html-login-register-forms-to-work-along-with-the-server-express-knex February 28, 2021 at 04:08PM