1.javabean
package com.jia.bean;
public class Student {
private String id;
private String name;
private String sex;
private String password;
public String getId() {
return id;
}
public void setId(String id) {
this.id = id;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public String getSex() {
return sex;
}
public void setSex(String sex) {
this.sex = sex;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
這裏設置的是一個Student類,包括了編號、姓名、性別和密碼四個屬性,驗證只用到了編號和密碼這兩個屬性。
2.賬號密碼檢驗
public int checkStudent(String id,String password) {
// TODO Auto-generated method stub
int result = 0;
Connection con=null;
PreparedStatement ps=null;
ResultSet rs=null;
Student student=null;
String sql="select * from student where id=?"; //表格名稱爲student
try {
con=Conjdbc.getCon(); //這個地方單獨編寫了一個獲取連接的方法
ps=con.prepareStatement(sql);
ps.setString(1, id);
rs=ps.executeQuery();
if (rs.next()) {
student=new Student();
student.setId(rs.getString(1));
student.setPassword(rs.getString(4));
}
if (student==null) {
return 0;
}
else if (!student.getPassword().equals(password)) {
return -1;
}
else {
return 1;
}
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
Conjdbc.closeCon(rs, ps, con);
return result;
}
檢驗分成了三種情況1.用戶不存在,返回0 2.用戶存在密碼錯誤,返回-1 3.用戶和密碼都正確。
3.對應的Servlet
public class LoginCheck extends HttpServlet {
private static final long serialVersionUID = 1L;
public void doGet(HttpServletRequest request, HttpServletResponse response) {
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response) {
PrintWriter pw = null;
int result=0;
try {
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
pw=response.getWriter();
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
String id="", password="";
id = request.getParameter("u");
password = request.getParameter("p");
result = ConStudentDAO.getInstance().checkStudent(id, password); //單例
if (result==0) {
pw.print("用戶不存在!");
}
else if (result==-1) {
pw.print("密碼錯誤!");
}
else {
pw.print("登錄成功!");
}
}
}
這個部分對前臺傳過來的數據進行數據庫查詢,判斷屬於哪種情況將信息返回給前臺。其中一定要注意字符編碼問題,一般網頁都使用的utf-8來編碼。
4.前端設計
<div class="login" >
<h1>Login</h1>
<form >
<input type="text" id="uname" name="u" placeholder="用戶名" required="required" />
<input type="password" id="pword" name="p" placeholder="密碼" required="required" />
<button type="button" class="btn btn-primary btn-block btn-large" onclick="loadCheck()">登錄</button>
<div id="insert" style="color:red;padding:10px;font-size:12px"></div>
</form>
</div>
這部分是表單,其中最下面的div用來顯示後臺返回的信息。
<script type="text/javascript">
var xmlhttp;
function loadCheck(){
var uname=document.getElementById('uname').value;
var pword=document.getElementById('pword').value;
if(uname.length==0||pword.length==0){alert("賬號或密碼爲空");return;}
if (window.XMLHttpRequest) {xmlhttp=new XMLHttpRequest();}
else{xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}
xmlhttp.onreadystatechange=getResult;
xmlhttp.open("POST","Demo",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("u="+uname+"&p="+pword);
}
function getResult(){
if (xmlhttp.readyState==4) {
if(xmlhttp.status==200){
var rec=xmlhttp.responseText;
document.getElementById("insert").innerHTML=rec;
}
else{
alert("連接失敗");
}
}
}
</script>
這部分的js將表單的數據傳到後臺,接收後臺的信息嵌入到前面的div中,有個要注意的問題是xmlhttp.resposeText應該寫在200d的判斷條件下,不然可能接收到的數據可能會變成問號。
5.結果展示
6.總結
在這個小例子的編寫中學到了很多,例如關於Servlet,每一個servlet都只會創建一個實例,而多線程是用在其中的如doPost方法中的,servlet類中的成員變量是所有連接共享的。