Estoy tratando de hace un login usando js y php, pero al enviar el formulario e ir a la pagina de validar_login.php me salta un error que dice undefined array key $id y contrasena. Y escribe el json_encode como "vacio".
Tambien se supone que al estar esas variables vacias y escribir el json_ecode "vacio" no deberia cambiar la pagina sino mostrar una alerta, pero igual avanza
Formulario: index.php
<form action="" method="POST" id="loginForm" enctype="multipart/form-data">
<div class="form-floating">
<input class="input" type="text" name="id" placeholder="Identificación">
</div>
<div class="form-floating">
<input class="input" type="password" name="contrasena" placeholder="Contraseña">
</div>
<input class="btn btn-outline-primary" type="submit" value="Iniciar Sesión"></input>
</form>
JS: validar_login.js
let formulario = document.getElementById("loginForm");
formulario.addEventListener("submit", envio);
let alerta = document.getElementById("alerta");
function envio(e) {
e.preventDefault();
let datos = new FormData(formulario);
fetch("./validar_login.php", {
method: "POST",
body: datos
})
.then((res) => res.json())
.then((data) => {
switch (data) {
case "vacio":
alerta.innerHTML = '<div class="alert alert-danger">COMPLETE TODOS LOS CAMPOS</div>';
break;
case "noExiste":
alerta.innerHTML = '<div class="alert alert-danger">IDENTIFICACIÓN O CONTRASEÑA INCORRECTOS</div>';
break;
case "ok":
alerta.innerHTML = '<div class="alert alert-success">INICIANDO SESIÓN</div>';;
window.location = "./pagina_principal.php";
break;
}
})
}
PHP: validar_login.php
<?php
include "./conexion_db.php";
function validarEntrada($entrada)
{
if (empty($entrada)) {
return false;
}
return true;
}
function obtenerRolUsuario($idUsuario, $conn)
{
$query = $conn->query("SELECT * FROM usuarios INNER JOIN roles ON usuarios.rolUsuario = roles.idRol WHERE idUsuario = '$idUsuario'");
$rol = $query->fetch(PDO::FETCH_ASSOC);
$rolNombre = $rol['nombreRol'];
return $rolNombre;
}
$id = $_POST['id']; //AQUI MUESTRA EL ERROR
$contrasena = $_POST['contrasena']; //AQUI MUESTRA EL ERROR
if (!validarEntrada($id) || !validarEntrada($contrasena)) {
echo json_encode("vacio");
} else {
$query = $conn->query("SELECT * FROM usuarios WHERE idUsuario = '$id'");
$datos = $query->fetch(PDO::FETCH_ASSOC);
$existe = $query->rowCount();
if ($existe !== 1) {
echo json_encode("noExiste");
} else {
$verificar_contrasena = password_verify($contrasena, $datos['contrasena']);
if (!$verificar_contrasena) {
echo json_encode("contrasenaIncorrecta");
} else {
echo json_encode("ok");
session_start();
$_SESSION['idUsuario'] = $id;
$_SESSION['rol'] = obtenerRolUsuario($id, $conn);
exit;
}
}
}
Tambien intente poniendo al atributo action la direccion de el php.
El codigo no me muestra ningun error
id="loginForm"
? Si ese fuera el caso, entonces tendría sentido que te este ocurriendo lo que mencionas. PD: no veo que este enviando los encabezados para indicar que la respuesta es un JSONvalidar_login.js
lo estas incluyendo ¿en el<body>
después del<form>
o en el<head>
antes del<body>
?