Error de tipo Uncaught (en la promesa): No se pueden establecer propiedades en null (estableciendo ‘onclick’) en users.js:18
Estoy tratando de crear un formulario de inicio de sesión en el que los datos de los usuarios se obtengan mediante una solicitud de búsqueda y se verifiquen con el siguiente código JavaScript:
fetch('./login.php', {
method: 'GET'
})
.then((res) => res.json())
.then(res => {
let user = []
for (let data of res){
user.push({
email: ""+data.email+"",
password : ""+data.password+""
})
}
El código en cuestión muestra un error en la consola. ¿Hay algo mal en mi enfoque?
Aquí está mi código HTML para el formulario (utilizando bootstrap):
<form action="" id="loginform">
<div class="mb-3">
<label for="useremail" class="form-label">Email:</label>
<input type="email" class="form-control" id="useremail" aria-describedby="Email" name="useremail" required="">
</div>
<div class="mb-3">
<label for="userpassword" class="form-label">Contraseña:</label>
<input type="password" class="form-control" id="userpassword" aria-describedby="Contraseña" name="userpassword" required="">
</div>
<button class="btn btn-danger submit" type="submit">Iniciar sesión</button>
<div class="row mt-3">
<a href="register.html" class="text-decoration-none text-decoration-underline text-dark fst-italic">¿No tienes una cuenta? Regístrate aquí.</a>
</div>
</form>
Cada vez que reviso la consola, muestra el error del título. ¿Hay algo mal en cómo estoy haciendo esto?
davy.ai
Parece que el problema está en la asignación button.onclick. Estás asignando el resultado de la función login a la propiedad onclick en lugar de la propia función. Deberías asignar la función sin los paréntesis de esta manera:
Por otra parte, también debes considerar usar POST en lugar de GET al transferir información sensible como nombres de usuario y contraseñas. Además, asegúrate de hashear la contraseña en el lado del servidor antes de almacenarla y compararla con la entrada del usuario para garantizar la seguridad.