用戶名驗證註冊MVC - JSP，Servlets

Question

我有一個html註冊表單，我正在使用Javascript來檢查字段進行驗證。不過，我需要檢查數據庫中是否存在用戶名，以及是否在警告用戶名的部分顯示消息。但是，我必須查看用戶是否存在檢查不起作用。

我曾嘗試檢查用戶類中是否存在用戶名。我試圖獲得一個實時驗證，所以當用戶輸入用戶名時，我有一個if語句來檢查數據庫以查看用戶名是否存在於數據庫中。我一直在尋找解決方案，我可以在網上找到的所有解決方案都是使用php。我想知道有人可以幫助或建議我。我已經包含了表單，servlet，使用的ajax，用戶類和servlet。 - 抱歉所有的代碼，但我希望有人能夠看到我錯了。

HTML表單

 Username: 

    <input id="username" required type="text" name="username" placeholder="Username" autocomplete="off" onkeyup="updateOutput(this.value)" /> 
<div id="userNameMessage"></div> 
</p> 

的Servlet

public boolean SaveUser() { 

    boolean saved = false; 
    try { 


     Connection connection = DBHelperClass.getConnection(); 
     Statement statement = connection.createStatement(); 

     String userCheck ="SELECT * FROM User where username='" + userName + "'"; 

     ResultSet rs1 = statement.executeQuery(userCheck); 
     boolean userExists = rs1.next(); 

       if (userExists){ 

     String template = "INSERT INTO user(userName, password, firstName,secondName, email, address, mobile,image) " 
       + "VALUES (?,?,?,?,?,?,?,?)"; 

     PreparedStatement inserter = connection.prepareStatement(template); 
     inserter.setString(1, this.userName); 
     inserter.setString(2, this.password); 
     inserter.setString(3, this.firstName); 
     inserter.setString(4, this.secondName); 
     inserter.setString(5, this.email); 
     inserter.setString(6, this.address); 
     inserter.setString(7, this.mobile); 
     inserter.setString(8, this.image); 

     inserter.executeUpdate(); 

     ResultSet rs = statement.executeQuery("select max(userid) from user"); 
     while (rs.next()) { 
      System.out.println("max row " + rs.getString(1)); 
      this.userId = rs.getString(1); 
     } 


     saved = true; 
     inserter.close(); 
     } 
       else{ 
       // print message on html page 
       } 
     connection.close(); 



    } catch (SQLException ex) { 
     Logger.getLogger(User.class.getName()).log(Level.SEVERE, null, ex); 
    } 



    return saved; 
} 

的Servlet

*/ else if (option.equalsIgnoreCase("add")) { 


      String username = mrequest.getParameter("username"); 
      System.out.println("username" + username); 


      String password = mrequest.getParameter("password"); 
      System.out.println("password" + password); 

      String firstName = mrequest.getParameter("firstName"); 
      System.out.println("firstName" + firstName); 


      String secondName = mrequest.getParameter("secondName"); 
      System.out.println("secondName" + secondName); 

      String email = mrequest.getParameter("email"); 
      System.out.println("email" + email); 


      String add = mrequest.getParameter("address"); 
      System.out.println("address" + address); 

      String mobile = mrequest.getParameter("mobile"); 
      System.out.println("mobile" + mobile); 

      String image = mrequest.getParameter("image"); 

      String userRole = null; 


      u = new User(null, username, password, firstName, secondName, email, add, mobile, filename, null); 
      boolean saved = u.SaveUser(); 
      session.setAttribute("user", u); 
      address = "/login.html"; 

Ajax代碼

  * 
     var xmlHttp; 
     function updateOutput(inputString)  {    

    if(inputString.length == 0)   {     

     document.getElementById("output").innerHTML = "";        
    return;    
     }      
     try   {     
    if(window.XMLHttpRequest)      
    xmlHttp = new XMLHttpRequest();     
     else if (window.ActiveXObject)     
     xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");             
     if(!xmlHttp || xmlHttp == null)    {      
     return;    }         
     var url="doajaxstuff.aspx?q=" + inputString;     
     xmlHttp.onreadystatechange=StateChanged;     
    xmlHttp.open("GET", url, true);    
    xmlHttp.send(null);   }    
     catch(e)   {     
     document.getElementById("output").innerHTML = "An error occured";   
      }     }    function StateChanged()  {    
      if((xmlHttp.readyState == 4) && (xmlHttp.status == 200))   {     
      document.getElementById("output").innerHTML = xmlHttp.responseText;     
      }    }  
      </script> 

Answer 1

我已經爲您創建了示例示例。這應該有所幫助。

AJAX調用：

<script type="text/javascript"> 

    var xmlHttp; 

    function updateOutput(inputString) { 
     if (inputString.length == 0) { 
      document.getElementById("output").innerHTML = ""; 
      return; 
     } 
     try { 
      if (window.XMLHttpRequest) 
       xmlHttp = new XMLHttpRequest(); 
      else if (window.ActiveXObject) 
       xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
      if (!xmlHttp || xmlHttp == null) { 
       return; 
      } 
      var url = "validate?userName=" + inputString; // Here, I have mapped servlet as "validate". 
      xmlHttp.onreadystatechange = StateChanged; 
      xmlHttp.open("GET", url, true); 
      xmlHttp.send(null); 
     } catch (e) { 
      document.getElementById("userNameMessage").innerHTML = "An error occured"; 
     } 
    } 
    function StateChanged() { 
     if ((xmlHttp.readyState == 4) && (xmlHttp.status == 200)) { 
      document.getElementById("userNameMessage").innerHTML = xmlHttp.responseText; 
     } 
    } 
</script> 

HTML：

Username: <input id="username" type="text" name="userName" onblur="updateOutput(this.value)" /> 
<span id="userNameMessage" style="margin-left:10px;"></span></br> 
First Name: <input id="firstname" type="text" name="firstName" /> 
.... other fields 

的Servlet：

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
     PrintWriter out = response.getWriter(); 
     String strStatus = "Username is available"; 
     try{ 
      System.out.println("Performing check"); 
      String username = request.getParameter("userName"); 
      String strQuery = "SELECT * FROM users WHERE uname='" + username +"'"; 
      ResultSet rs = DatabaseManager.executeQuery(strQuery); 
      boolean userExists = rs.next(); 
      if (userExists){ 
       strStatus = "Username already exists"; // Return Exist Msg 
      } 
     }catch(Exception e){ 
      strStatus = "Some error occured. Try again"; // Return Err Msg 
      e.printStackTrace(); 
     } 
     out.println(strStatus); 
    } 

現在是一個天，jQuery的 Ajax調用被認爲是很好的做法。你可以看看它here。