Login Validation Wrong React Node js

Question

i am creating a simple login form using frontend react backend node js.while attempt to login login failure. if we type wrong email and password alert msg displays login success. i don't know why.my backend i tested through postman it is work well.check through react had a problem.what i tried so far i attached below.

import axios from "axios";
import {  useState } from "react";
import { useNavigate } from 'react-router-dom';

function Login() {

    const [email, setEmail] = useState("");
    const [password, setPassword] = useState("");
    const navigate = useNavigate();
    


    async function login(event) {
        event.preventDefault();
        try {
          await axios.post("http://localhost:9992/student/login", {

             email: email,
            password: password,
           
          });
         
          alert("Login Successfully"); 
         
              
        //  navigate('/home');
         
        
        } catch (err) {
          alert("ogin Failed");
        }
      }



    return (
     <div>
            <div class="container">
            <div class="row">
                <h2>Login</h2>
             <hr/>
             </div>

             <div class="row">
             <div class="col-sm-6">
 
             <form>
             <div class="form-group">
          <label>email</label>
          <input type="email"  class="form-control" id="email" placeholder="Enter Name"
          
          value={email}
          onChange={(event) => {
            setEmail(event.target.value);
          }}
          
          />
          
          
          
        </div>

        <div class="form-group">
            <label>password</label>
            <input type="password"  class="form-control" id="password" placeholder="Enter Fee"
            
            value={password}
            onChange={(event) => {
              setPassword(event.target.value);
            }}
            
            />
          </div>
                  <button type="submit" class="btn btn-primary" onClick={login} >Login</button>
              </form>

            </div>
            </div>
            </div>

     </div>
    );

Your current logic isn't checking for login validation? Inside the try block you can assign the axios.post call's results to a variable data and based on that data you then use condition checker statement like if...else and respond accordingly. — Aleksandar
– Aleksandar, Commented Jan 30, 2023 at 9:34

Aleksandar · Accepted Answer · 2023-01-30 09:49:52Z

1

I am using the data value based on your comment.

Modify your login function as following:

async function login(event) {
event.preventDefault();
 try {
  const res = await axios.post("http://localhost:9992/student/login", {
  email: email,
  password: password,
  });
  const data = res.data;

  if (data.status === true) {
  alert("Login Successfully"); 
  } else {
  alert("Login failed")
  }

 } catch (err) {
  alert("Error, please try again");
 }
}

answered Jan 30, 2023 at 9:49

Aleksandar

8571 gold badge9 silver badges21 bronze badges

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

2 Comments

abi jega Over a year ago

i got the error error res.data . i attached the node js above

abi jega Over a year ago

Login failed displayed i tried above. if i enter the correct data also faild

Collectives™ on Stack Overflow

Login Validation Wrong React Node js

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related