本文執行個體講述了JSP+Servlet+JavaBean實現登入網頁的方法。分享給大家供大家參考。具體如下：
這裡涉及到四個檔案:
1. 登入頁面:login.html
2. 登入成功歡迎頁面:login_success.jsp
3. 登入失敗頁面:login_failure.jsp
4. Servlet處理檔案:LoginServlet.java
其實還涉及到一個檔案:web.xml,這個後面再說:
下面分別介紹這幾個檔案:
1. 登入頁面:login.html
<!-- 該Login頁面是一個簡單的登入介面 --><!-- 該JSP程式是用來測試與MySQL資料庫的串連， 需要一個資料庫：LearnJSP，和其中一個表：userinfo 表中有兩個欄位分別為：UserName varchar (20) not null,UserPwd varchar (20) not null--><html> <head> <title>登入</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Language" content="ch-cn"> </head> <body> <!-- Form 用來提取使用者填入並提交的資訊--> <form method="post" name="frmLogin" action="LoginServlet"> <h1 align="center">使用者登入</h1><br> <div align="center">使用者名稱： <input type="text" name="txtUserName" value="Your name" size="20" maxlength="20" onfocus="if(this.value=='Your name')this.value='';"><br>密碼： <input type="password" name="txtPassword" value="Your password" size="20" maxlength="20" onfocus="if(this.value=='Your password')this.value='';"><br> <input type="submit" name="Submit" value="提交" onClick="validateLogin();" > <input type="reset" name="Reset" value="重設"><br> </div> </form> <!-- javaScript 函數 validateLogin(),用來驗證使用者名稱和密碼是否為空白 --> <script language="javaScript"> function validateLogin() { var sUserName = document.frmLogin.txtUserName.value; var sPassword = document.frmLogin.txtPassword.value; if( sUserName=="" ) { alert("請輸入使用者名稱！"); return false; } if( sPassword=="" ) { alert("請輸入密碼！"); return false; } } </script> </body></html>
2. 登入成功歡迎頁面:login_success.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>My JSP 'login_failure.jsp' starting page</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> <% String userName = (String)session.getAttribute ( "UserName" ); %> <div align=center> <%=userName%> 歡迎您，登入成功！ </div> </body></html>
3. 登入失敗頁面:login_failure.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>My JSP 'login_failure.jsp' starting page</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <!-- <link rel="stylesheet" type="text/css" href="styles.css"> --> </head> <body> <% String userName = (String)session.getAttribute ( "UserName" ); %> <div align=center> <%=userName%> 對不起，登入失敗！ </div> </body></html>
4. Servlet處理檔案:LoginServlet.java
/** * 該JSP程式是用來測試與MySQL資料庫的串連， * 需要一個資料庫：LearnJSP，和其中一個表：userinfo * 表中有兩個欄位分別為：UserName varchar (20) not null,UserPwd varchar (20) not null */package zieckey.login.servlet;import java.sql.Statement;import java.io.IOException;import java.sql.DriverManager;import java.sql.ResultSet;import java.sql.SQLException;import javax.servlet.Servlet;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;public class LoginServlet extends HttpServlet implements Servlet{ public LoginServlet () { // TODO Auto-generated constructor stub } /* * (non-Javadoc) * * @see javax.servlet.http.HttpServlet#doGet(javax.servlet.http.HttpServletRequest, * javax.servlet.http.HttpServletResponse) */ @Override protected void doGet ( HttpServletRequest arg0, HttpServletResponse arg1 ) throws ServletException, IOException { } /* * (non-Javadoc) * * @see javax.servlet.http.HttpServlet#doPost(javax.servlet.http.HttpServletRequest, * javax.servlet.http.HttpServletResponse) */ @Override protected void doPost ( HttpServletRequest request, HttpServletResponse response ) throws ServletException, IOException { response.setContentType ( "text/html" ); String result = ""; // 擷取使用者名稱 String sUserName = request.getParameter ( "txtUserName" ); if ( sUserName == "" || sUserName == null || sUserName.length ( ) > 20 ) { try { result = "請輸入使用者名稱（不超過20字元）！"; request.setAttribute ( "ErrorUserName", result ); response.sendRedirect ( "login.html" ); } catch ( Exception e ) { } } // 擷取密碼 String sPasswd = request.getParameter ( "txtPassword" ); if ( sPasswd == "" || sPasswd == null || sPasswd.length ( ) > 20 ) { try { result = "請輸入密碼（不超過20字元）！"; request.setAttribute ( "ErrorPassword", result ); response.sendRedirect ( "login.html" ); } catch ( Exception e ) { } } // 登記JDBC驅動程式 try { Class.forName ( "org.gjt.mm.mysql.Driver" ).newInstance ( ); } catch ( InstantiationException e ) { // TODO Auto-generated catch block e.printStackTrace ( ); System.out.println ("InstantiationException"); } catch ( IllegalAccessException e ) { // TODO Auto-generated catch block e.printStackTrace ( ); System.out.println ("IllegalAccessException"); } catch ( ClassNotFoundException e ) { // TODO Auto-generated catch block e.printStackTrace ( ); System.out.println ("ClassNotFoundException"); } // 串連參數與Access不同 String url = "jdbc:mysql://localhost/LearnJSP"; // 建立串連 java.sql.Connection connection = null; Statement stmt = null; ResultSet rs = null; try { connection = DriverManager.getConnection ( url, "root", "011124" ); stmt = connection.createStatement ( ); // SQL語句 String sql = "select * from userinfo where username='" + sUserName + "' and userpwd = '" + sPasswd + "'"; rs = stmt.executeQuery ( sql );// 返回查詢結果 } catch ( SQLException e ) { // TODO Auto-generated catch block e.printStackTrace ( ); } try { if ( rs.next ( ) )// 如果記錄集非空，表明有匹配的使用者名稱和密碼，登陸成功 { // 登入成功後將sUserName設定為session變數的UserName // 這樣在後面就可以通過 session.getAttribute("UserName") 來擷取使用者名稱， // 同時這樣還可以作為使用者登入與否的判斷依據 request.getSession ( ).setAttribute ( "UserName", sUserName ); response.sendRedirect ( "login_success.jsp" ); } else { // 否則登入失敗 //response.sendRedirect ( "MyJsp.jsp" ); response.sendRedirect ( "login_failure.jsp" ); } } catch ( SQLException e ) { // TODO Auto-generated catch block e.printStackTrace ( ); } try { if ( null!=rs ) { rs.close ( ); } if ( null!=stmt ) { stmt.close ( ); } if ( null!=connection ) { connection.close ( ); } } catch ( SQLException e ) { // TODO Auto-generated catch block e.printStackTrace ( ); } } /** * */ private static final long serialVersionUID = 1L;}
為了讓這個網站正常運行還要到web.xml中註冊一下,
現該檔案內容修改如下:
<?xml version="1.0" encoding="UTF-8"?><web-app xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="2.4" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd"> <servlet> <display-name>LoginServlet</display-name> <servlet-name>LoginServlet</servlet-name> <servlet-class>zieckey.login.servlet.LoginServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>LoginServlet</servlet-name> <url-pattern>/LoginServlet</url-pattern> </servlet-mapping></web-app>
好了,這幾個檔案就可以構成我們的這個登入介面了.
注意事項:
1. 檔案目錄形式
login.html,login_success.html,login_failure.html這三個檔案放在同一目錄,
LoginServlet.java該檔案的位元組碼檔案LoginServlet.class放在WEB-INF/classes目錄下(注意jar包順序)
現在整個工程的目錄形式是:
M:/Tomcat5.5/webapps/JSP_Servlet_JavaBean_Login 的目錄
007-01-18 15:16 <DIR> META-INF
007-01-18 15:16 <DIR> WEB-INF
007-01-18 16:17 1,801 login.html
007-01-18 15:48 858 login_failure.jsp
007-01-18 15:40 234 login_success.html
007-01-18 15:46 781 MyJsp.jsp
007-01-18 16:12 859 login_success.jsp
M:/Tomcat5.5/webapps/JSP_Servlet_JavaBean_Login/WEB-INF 的目錄
007-01-18 15:16 <DIR> classes
007-01-18 15:16 <DIR> lib
007-01-18 16:21 606 web.xml
M:/Tomcat5.5/webapps/JSP_Servlet_JavaBean_Login/WEB-INF/classes/zieckey/login/servlet 的目錄
2007-01-18 16:18 3,900 LoginServlet.class
2. 其他注意事項
資料庫MySQL伺服器程式要先啟動起來.
希望本文所述對大家的JSP程式設計有所協助。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
