Currently facing an issue where my form includes inputs for username and password, a captcha (<div>), and a submit button. Upon clicking the submit button, I want it to first check if the captcha is empty. If not, then proceed to call the Java code that authenticates the user.
This is how my jsp form looks:
<html>
<head>
<!-- additional scripts / google api js go here -->
<script type="text/javascript">
function validate(form) {
var v = grecaptcha.getResponse();
if(v.length === 0) {
document.getElementById('captcha').innerHTML="Login failed: Empty captcha";
return false;
} else {
return true;
}
}
</script>
</head>
<body>
<form action="login" method="post" onsubmit="return validate(this);">
<input type="text" id="email" value="${fn:escapeXml(param.email)}" required>
<input type="text" id="password" value="${fn:escapeXml(param.password)}" required>
<div class="g-recaptcha" data-sitekey="xxx"></div>
<input class="submit_button" type="submit" name="submit" value="Submit" />
<span class="error"${error.invalid}</span>
<div id="captcha" class="captchaError"></div>
</form>
</body>
</html>
And this is my login servlet responsible for user verification:
@WebServlet("/login")
public class LoginServlet extends HttpServlet {
private LoginDAO loginDAO;
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.getRequestDispatcher("login.jsp").forward(request,response);
}
@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
Map<String, String> error = new HashMap<String,String>();
request.setAttribute("error",error);
String email = request.getParameter("email");
String password = request.getParameter("password");
// Verify reCaptcha
String gRecaptchaResponse = request.getParameter("captcha");
boolean verify = VerifyRecaptcha.verify(gRecaptchaResponse);
if(!verify) {
error.put("captcha","You seem to be a robot. Try using the captcha again.");
}
if(error.isEmpty()) {
loginDAO = new LoginDAO();
try {
List<Customer> customer = new ArrayList<Customer>();
customer = loginDAO.validate(email,password);
if(customer.isEmpty()) {
error.put("invalid","Invalid email or password");
}
if(error.isEmpty()) { // no errors, proceed
HttpSession session = request.getSession(true);
Customer user = customer.get(0);
session.setAttribute("user",user);
response.sendRedirect("main");
return;
}
request.getRequestDispatcher("login").forward(request,response);
} catch(SQLException e) {
throw new ServletException("Could not authenticate login",e);
}
loginDAO.closeLoginDAO();
}
}
}
The 'loginDAO' just verifies the username and password against a database.
Suddenly encountering issues, even though everything was functioning correctly last night. The only change made was moving the java files into subdirectories. The 'web.xml' file was updated as well to ensure nothing was wrong.
I suspect the 'onsubmit=' part of the 'form' is interfering with the Java class. Any guidance on the correct approach for form validation using JavaScript and Java? Unfortunately, some level of JavaScript is necessary for the reCaptcha to prevent submission with an empty captcha.