Servlet開發(2)
Jsp&Servlet使用者登入功能實現(採用MVC模式)
我們使用Jsp&Servlet開發一個使用者登入功能的小專案（麻雀大小，但是五臟俱全呦,關鍵是技術問題！）。
資料庫：mysql
驅動包為 mysql-connector-java-3.1.12-bin.jar(下載連結：連結: https://pan.baidu.com/s/1_MlQONkdr5l1nKtO8OZCPQ 提取碼: 442t)
驅動包放置在 HeadFirstJspServlet05/com.java1234.model/WeebContent/WEB-INF/lib下
開發工具：eclipse
客戶端：Chrome瀏覽器
系統架構：
①在com.java1234.model下是User模型；
在User類中 屬性有id,userName,password;
主要作用是建立一個基礎使用者（id,使用者名稱，密碼（沒有涉及加密，以後會更新，打算採用MD5加密））的模型。
程式碼如下：
1 package com.java1234.model; 2 public class User { 3 private int id; 4 private String userName; 5 private String password; 6 7 public User(String userName, String password) {User.java8 super(); 9 this.userName = userName; 10 this.password = password; 11 } 12 13 public User() { 14 super(); 15 // TODO Auto-generated constructor stub 16 } 17 18 public String getUserName() { 19 return userName; 20 } 21 22 publicvoid setUserName(String userName) { 23 this.userName = userName; 24 } 25 26 public String getPassword() { 27 return password; 28 } 29 30 public void setPassword(String password) { 31 this.password = password; 32 } 33 34 public int getId() { 35 return id; 36 } 37 38 public void setId(int id) { 39 this.id = id; 40 } 41 }
②在com.java1234.util下是建立的DbUtil模型，主要是連線資料庫用的。
這部分程式碼需要加強記憶；
其實細分也很簡單的，主要存在的知識要點：
資料庫連結地址dbUrl="jdbc:mysql://localhost:3306/db_jsp"(資料庫名字);
資料庫驅動：jdbcName="com.mysql.jdbc.Driver";
資料庫名稱：dbUserName="root";
資料庫密碼：dbpassword="123456";
資料庫連線getcon()方法，資料庫關閉closecon()方法;
程式碼如下：
package com.java1234.util; import java.sql.Connection; import java.sql.DriverManager; public class DbUtil { private String dbUrl="jdbc:mysql://localhost:3306/db_jsp";//資料庫連結地址 private String dbUserName="root";//資料庫使用者名稱稱 private String dbPassword="123456";//資料庫密碼 private String jdbcName="com.mysql.jdbc.Driver";//jdbc驅動 public Connection getcon() throws Exception{ Class.forName(jdbcName);//反射例項化jdbc驅動包 Connection con =DriverManager.getConnection(dbUrl, dbUserName, dbPassword); return con; } public void closeCon(Connection con) throws Exception{ if(con !=null){ con.close(); } } public static void main(String[] args) { DbUtil dbutil=new DbUtil(); try { Connection con=dbutil.getcon(); System.out.println("資料庫連線成功！"); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } } }DbUtil..java
資料庫表為：
t_user :
③在com.java1234.dao下建立的Dao模型，主要是對User模型進行操作。
主要操作login()方法(主要是獲取資料庫資料String sql=”SELECT * from t_user where userName =? and password=?”; )
-----> PrepareStatement pstmt = prepareStatement(sql)
----> 對第1個引數和第2個引數進行設定
pstmt.setString(1, user.getUserName()); pstmt.setString(2, user.getPassword());
----->執行資料庫查詢指令 ResultSet rs=pstmt.executeQuery();
程式碼如下：
1 package com.java1234.dao; 2 import java.sql.Connection; 3 import java.sql.PreparedStatement; 4 import java.sql.ResultSet; 5 import com.java1234.model.User; 6 public class Userdao { 7 public User login(Connection con,User user) throws Exception{ 8 User resultUser=null; 9 String sql="SELECT * from t_user where userName=? and password=? "; 10 PreparedStatement pstmt=con.prepareStatement(sql); 11 pstmt.setString(1, user.getUserName()); 12 pstmt.setString(2, user.getPassword()); 13 ResultSet rs=pstmt.executeQuery(); 14 if(rs.next()){ 15 resultUser=new User(); 16 resultUser.setUserName(rs.getString("userName")); 17 resultUser.setPassword(rs.getString("passWord")); 18 } 19 return resultUser; 20 } 21 }Userdao.java
④com.java1234.web下的LoginServlet.java 進行後端處理，主要將前端頁面的資料傳到後端。（還有驗證功能，對資料庫中不存在的資料會進行判錯，error 並且在前端頁面輸出）
程式碼如下：
1 package com.java1234.web; 2 import java.io.IOException; 3 import java.sql.Connection; 4 import javax.servlet.ServletException; 5 import javax.servlet.http.HttpServlet; 6 import javax.servlet.http.HttpServletRequest; 7 import javax.servlet.http.HttpServletResponse; 8 import javax.servlet.http.HttpSession; 9 10 import com.java1234.dao.Userdao; 11 import com.java1234.model.User; 12 import com.java1234.util.DbUtil; 13 14 public class LoginServlet extends HttpServlet{ 15 private static final long serialVersionUID = 1L; 16 DbUtil dbutil=new DbUtil(); 17 Userdao userdao=new Userdao(); 18 @Override 19 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 20 // TODO Auto-generated method stub 21 this.doPost(request,response); 22 } 23 24 @Override 25 protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 26 // TODO Auto-generated method stub 27 String userName=request.getParameter("userName"); 28 String password=request.getParameter("password"); 29 Connection con=null; 30 try { 31 User user=new User(userName,password); 32 con=dbutil.getcon(); 33 User currentuser = userdao.login(con,user); 34 if(currentuser == null){ 35 request.setAttribute("error", "使用者名稱或者密碼錯誤"); 36 request.setAttribute("userName", userName); 37 request.setAttribute("password", password); 38 request.getRequestDispatcher("Login.jsp").forward(request, response); 39 }else{ 40 HttpSession session=request.getSession(); 41 session.setAttribute("currentuser", currentuser); 42 response.sendRedirect("main.jsp"); 43 } 44 } catch (Exception e) { 45 // TODO Auto-generated catch block 46 e.printStackTrace(); 47 } 48 } 49 }LoginServlet.java
涉及技術要點：
RequestDispatcher介面 伺服器跳轉... 參考部落格（部落格寫的確實好！）
https://www.cnblogs.com/lulipro/p/7471987.html
⑤jsp頁面，我們可以看到是一個簡單的使用者登入功能的實現。
1 <%@ page language="java" contentType="text/html; charset=utf-8" 2 pageEncoding="utf-8"%> 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 4 <html> 5 <head> 6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 7 <title>target-redirect</title> 8 <script type="text/javascript"> 9 function resetInfo(){ 10 document.getElementById("userName").value="";//document操縱html文件內容。 11 document.getElementById("password").value=""; 12 } 13 </script> 14 </head> 15 <body> 16 <form action="login" method="post"> 17 <h4>使用者登入</h4> 18 <table> 19 <tr> 20 <td>使用者名稱：</td> 21 <td><input type="text" id="userName" name="userName" value="${userName}"/></td> 22 </tr> 23 <tr> 24 <td>密碼：</td> 25 <td><input type="password" id="password" name="password" value="${password}"></td> 26 </tr> 27 <tr> 28 <td><input type="submit" value="登入"/></td> 29 <td colspan="2"><input type="button" value="重置" onclick="resetInfo()"/> 30 <font color="red">${error}</font> 31 </td> 32 33 </tr> 34 </table> 35 </form> 36 </body> 37 </html>Login.jsp
涉及的技術點：
- javascript指令碼: document.getElementById(" ").
每個載入瀏覽器的 HTML 文件都會成為 Document 物件。
Document 物件使我們可以從指令碼中對 HTML 頁面中的所有元素進行訪問。
- value="${userName}"；el表示式
介面：
登入介面：
報錯處理：
重置：
登陸成功：
小 項 目 就 此 ok！