estoyEstoy tratando de hacer un login sencillo usando servletsservlets
, jqueryjquery
y ajaxajax
, pero no encuentro la forma que me funcione.
Adjunto
Adjunto mi codigocódigo para que me puedan ayudar, he intentando de varias formas pero nada aun.La conexión a la BD si se da, pude ingresar solo con código JSPJSP
y se pudo. Pero ahora estoy intentado usar AjaxAjax
, ya que planeo aprender mas cosas sobre como usarlo en un futuro. Muchas gracias.
La base está en MySQLMySQL
. Es solo una tabla sencilla, pero que servirá para más adelante. No sé que más poner porque me dice que hay pocápoca descripción así que uso este texto como relleno para ver si me deja publicar xd, no se debería tener esa restricción puesto que se puede explicar bien sin mucho texto, pero asumo que es la lógica de la web.
/*Clase con la conexión a BD y métodos*/
public class BDLoginSistema {
private String Driver = "com.mysql.cj.jdbc.Driver";
private String URL = "jdbc:mysql://localhost:3306/proyajax?useSSL=false";
private String Usuario = "root";
private String Password = "mysql";
private Connection Cn;
private CallableStatement cstm;
private ResultSet rs;
private String publicDriver BDLoginSistema()= {"com.mysql.cj.jdbc.Driver";
private String URL = "jdbc:mysql://localhost:3306/proyajax?useSSL=false";
private String Usuario = "root";
private String Password try= {"mysql";
private Connection Class.forName(Driver);Cn;
private CallableStatement cstm;
private ResultSet rs;
Cn =public DriverManager.getConnectionBDLoginSistema(URL,Usuario,Password);
} {
try {
catch Class.forName(ClassNotFoundException | SQLException eDriver) {;
System.out.print("**********************ERRORCn "= +eDriverManager.getMessagegetConnection()URL,Usuario,Password);
}
}
public booleancatch Login(StringClassNotFoundException usr,| StringSQLException pwde) {
System.out.print("**********************ERROR " +e.getMessage());
}
}
public boolean Login(String usr, String pwd){
String SQL = "CALL usp_login(?,?);";
try {
cstm = Cn.prepareCall(SQL);
cstm.setString(1, usr);
cstm.setString(2, pwd);
rs = cstm.executeQuery();
if(rs.next()){
return true;
}
} catch (SQLException e) {
System.out.print("************ERROR EN LOGIN" + e.getMessage());
}
} catch return(SQLException false;e) {
System.out.print("************ERROR EN LOGIN" + e.getMessage());
}
return false;
}
}
/*Servlet Java*/
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
PrintWriter out = response.getWriter();
try {
NegocioLogin ObjNL = new NegocioLogin();
String usuario = request.getParameter("usuario");
String password = request.getParameter("password");
boolean flagLogin = ObjNL.Login(usuario, password);
if(flagLogin == true){
response.setContentType("text/html; charset=iso-8859-1");
out.write("menuIngreso");
}
else{
response.setContentType("text/html; charset=iso-8859-1");
out.write("Error");
}
} catch (Exception e) {
e.printStackTrace();
}
}
} catch (Exception e) {
e.printStackTrace();
}
}
/*Index.jsp*/
<html>
<head>
<title>Login</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto|Varela+Round">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/style.css">
<script src="js/validarLogin.js"></script>
</head>
<body>
<div class="container">
<form class="form-signin">
<h2 class="form-signin-heading">Ingrese por Favor</h2>
<div id="errorLogin">
</div>
<br>
<label for="inputUsuario" class="sr-only">Usuario</label>
<input type="text" id="inputUsuario" name="inputUsuario" class="form-control" placeholder="Usuario" required autofocus>
<label for="inputPassword" class="sr-only">Contraseña</label>
<input type="password" id="inputPassword" name="inputPassword" class="form-control" placeholder="Contraseña" required>
<button class="btn btn-lg btn-primary btn-block" type="submit" id="Enviar">Ingresar</button>
</form>
</div>
</body>
</html>
/*Archivo .JS con la función Ajax.*/
$(document).ready(function(){
<form $('#Enviar').click(function(){class="form-signin">
<h2 varclass="form-signin-heading">Ingrese userpor =$('#inputUsuario').val();Favor</h2>
var pwd =<div $('#inputPassword').val();id="errorLogin">
</div>
<br>
<label for="inputUsuario" class="sr-only">Usuario</label>
<input type="text" id="inputUsuario" name="inputUsuario" class="form-control" placeholder="Usuario" required autofocus>
<label for="inputPassword" class="sr-only">Contraseña</label>
<input type="password" id="inputPassword" name="inputPassword" class="form-control" placeholder="Contraseña" required>
<button class="btn btn-lg btn-primary btn-block" type="submit" id="Enviar">Ingresar</button>
</form>
</div>
</body>
</html>
/*Archivo .JS con la función Ajax.*/
$(document).ready(function(){
$('#Enviar').click(function(){
var user =$('#inputUsuario').val();
var pwd = $('#inputPassword').val();
$.ajax({
type: "POST",
url: "servletLogin",
data: {"usuario" : user, "password" : pwd},
dataType: "json",
success: function(data) {
if (data == 'menuIngreso') {
var url = 'menuIngreso.html';
window.location.href = url;
}
} else {
else {
$("#errorLogin").html(data);
}
}
}
});
});
});
});