Error: Undefined Binding(s) when I’m going to give a

Asked

Viewed 57 times

0

I’m trying to make a login system , I wrote the code and when I do it works perfectly , but when I made the connection to the front end using Axios it can’t send the typed data to the database. I tried some things: I tried to give a alert outside the try and it returns exactly what I typed , but when I try to put the samealertwithin the try it returns me the string I typed as undefined. The error it returns is :

C:\users\mathe\desktop\eventos\backend\node_modules\knex\lib\query\compiler.js:98
      throw new Error(
            ^

Error: Undefined binding(s) detected when compiling FIRST. Undefined column(s): [email] query: select `password` from `users` where `email` = ? limit ?
    at QueryCompiler_SQLite3.toSQL (C:\users\mathe\desktop\eventos\backend\node_modules\knex\lib\query\compiler.js:98:13)
    at Builder.toSQL (C:\users\mathe\desktop\eventos\backend\node_modules\knex\lib\query\builder.js:97:44)
    at C:\users\mathe\desktop\eventos\backend\node_modules\knex\lib\runner.js:31:36
    at C:\users\mathe\desktop\eventos\backend\node_modules\knex\lib\runner.js:277:24
    at async login (C:\users\mathe\desktop\eventos\backend\src\controller\userController.js:40:26)

react code :

import React  , {useState}from 'react';
import './stylesheet.css';
import {useHistory} from 'react-router-dom'
import api from '../services/api'

export default function Login() {
    const [email , setEmail] = useState("");
    const [pass , setPassword] = useState("");

    const history = useHistory();

    async function handleLogin(e){
        e.preventDefault();

        const data = {
            email,
            pass
        }
        
        try{
            const response = await api.get('/login' , {data})

            localStorage.setItem('id' , response.data.user.id)
            localStorage.setItem('nome',response.data.user.nome)

            alert(response.data.user);
            history.push('/calendario')
        }catch(err){
            alert("nope");
        }
    }
    return(
        <div className='Logon'>
            <h1>App de eventos</h1>
            <form className='login' onSubmit={handleLogin}>
            <p>Login : <input placeholder='Digite seu login' value={email}
            onChange={e => setEmail(e.target.value)}/></p>
            <p>{email}</p>
            <p>Senha : <input type='password' placeholder='Digite sua senha'value={pass}
            onChange={e => setPassword(e.target.value)}/></p> 
            <button type="submit">ENTRAR</button>
            </form>
        </div>
    )
};

back-end:

const connection = require('../database/connection');

module.exports = {
async login(req , resp){
        const {email , pass} = req.body;

        const password = await connection('users').where('email',email).select('password').first();

        const check_pass = bcrypt.compareSync(pass,password.password);
        
        const user = await connection('users').where('email' , email);

        if(!check_pass){
            return resp.json({ae : 'deu nao'});
        }else{
            return resp.json({user})
        }
    }
}

Routes code for Node.js:

const express = require('express');
const routes = express.Router();

const userController = require('./controller/userController');

routes.get('/login' , userController.login);

module.exports = routes;

Node.js:

const routes = require('./routes');
const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors());
app.use(express.json());
app.use(routes);

app.listen(3333);
node.js react http axios try-catch

  • Try the following changes, in the Xios request take the date {} out, leave only the data field and in the backend, make conditions if it sends the empty fields, before searching in the database

  • I did that, I removed the brackets and did an if to give a console.log if email is undefinied, he just gave the console.log. But my main doubt is , why when I give Alert out of Try it returns just what I typed ,and inside Try it returns as undefinied

  • I ended up solving only switching to the POST method , I will respond and leave here if someone has the same question.

1 answer

1


I ended up solving only changing the GET method to POST. As much as you are looking for information inside the database, it is necessary to be in the POST method, because it is necessary every time when sending a form or file. The GET method would only be feasible if you were just fetching information from the server without a form.

Browser other questions tagged node.js react http axios try-catch

You are not signed in. Login or sign up in order to post.