實現(xiàn)功能:
模擬簡單登錄功能,登錄成功跳轉(zhuǎn)新頁面,登錄失敗在原登錄界面提示登錄失敗信息
開發(fā)環(huán)境:
- eclipse
- Tomcat-8.0
預(yù)備知識:
HTML標(biāo)簽,Servlet相關(guān)知識——請求的轉(zhuǎn)發(fā)與重定向,jsp相關(guān)知識,EL表達(dá)式
思路實現(xiàn):共2個jsp,一個servlet
1.登錄界面login.jsp:
采用jsp,不采用html的原因是因為要進(jìn)行登錄失敗信息回顯(當(dāng)然如果用html結(jié)合ajax也可以實現(xiàn),這里采用jsp更方便)
如圖:
2.登錄成功界面hello.jsp:
歡迎信息+登錄的用戶名
如圖:
3.登錄失敗信息回顯Login.jsp:
如圖:
思路簡述:
問題1:jsp頁面如何與一個java類進(jìn)行連接綁定起來?
簡單的說,一個jsp頁面要跟一個servlet進(jìn)行連接,需要有一個橋梁,這個橋梁就是web.xml文件,可以通過下面代碼觀察到,登錄頁面的表單的提交的action屬性值,填寫的就是在web.xml文件里對應(yīng)的servlet-mapping中的url-pattern的值,而這個值又對應(yīng)了一個servlet-name,servlet-name則對應(yīng)到一個servlet-class,這樣就把jsp和java類(servlet類)進(jìn)行了關(guān)聯(lián)。
其實我覺得最明顯的就是提交表單后,url地址變化了,通過這個url地址將表單信息傳給了對應(yīng)的java類。
問題2:實現(xiàn)的整體的思路是怎么樣的?
一個jsp頁面通過表單元素,將用戶信息通過url的形式提交給一個已經(jīng)在web.xml配置映射好的servlet類,servlet類接收到傳來的表單信息,進(jìn)行值校驗(為了方便起見則直接定義用戶名密碼了,正常情況下是要采用jdbc進(jìn)行從數(shù)據(jù)庫中取出值進(jìn)行校驗的),然后對校驗結(jié)果進(jìn)行判斷,如果賬戶密碼正確,則跳轉(zhuǎn)到登錄成功的頁面(采用重定向),如果失敗,則將登錄失敗的提示信息存到request域?qū)ο笾胁⒎祷氐卿浗缑骘@示出來(采用請求的轉(zhuǎn)發(fā))
簡單的聯(lián)系:
jsp頁面<---------->web.xml<--------->servlet類
問題3:在servlet中要如何獲取jsp中提交過來的表單信息呢?
request.getParameter("userName");//userName是表單中,input標(biāo)簽中name屬性的值,接收到的是string類型
問題4:登錄頁面如何在登錄失敗的時候給出提示信息呢?
實現(xiàn)思路是如果登錄失敗,則往request域?qū)ο笾写嫒氲卿浭〉奶崾拘畔ⅲ缓笸ㄟ^請求的轉(zhuǎn)發(fā)的方式跳轉(zhuǎn)回登錄頁面并顯示,所以登錄界面要嵌入一段腳本代碼,用來判斷當(dāng)前是否有登錄失敗提示信息的對象,如果有則將該對象保存的信息打印出來,如果沒有則什么都不顯示。
1)如果賬密不匹配,則往request域中存入message對象,該message中保存了提示信息:request.setAttribute("message", "賬密錯誤,請重新登錄<br>");
并轉(zhuǎn)發(fā)到登錄頁面:request.getRequestDispatcher("/loginDemo/login.jsp").forward(request, response);
2)在登錄頁面獲取該對象:(因為登錄失敗的時候才有該對象,疑問:那如果我登錄失敗后再訪問登錄頁面,那不應(yīng)該會顯示錯誤信息嗎?答案是否定的。可了解request域?qū)ο笊芷谙嚓P(guān)知識)
1
2
3
4
5
|
<% if (request.getAttribute( "message" )!= null ){ out.print(request.getAttribute( "message" )); } %> |
問題5:request.getAttribute()和request.getParameter()區(qū)別是:
前者獲取的是一個object對象,后者獲取的是一個string字符串,所以前者使用的時候可能會碰到需要做一些類型轉(zhuǎn)換的情況。
問題6:表單訪問路徑填寫問題
在ation屬性,或者請求的轉(zhuǎn)發(fā),重定向,一般采用絕對路徑,可以避免路徑訪問出錯,訪問資源不存在等問題。
jsp表達(dá)式:<%=request.getContextPath()%>或者用EL表達(dá)式:${ pageContext.request.contextPath }可以獲取當(dāng)前web應(yīng)用根目錄路徑,不妨試試輸出打印下,就可以觀察值是多少了。
具體代碼Code:
1.login.jsp:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
|
<%@ page language= "java" contentType= "text/html; charset=UTF-8" pageEncoding= "UTF-8" %> <!DOCTYPE html> <html> <head> <meta http-equiv= "Content-Type" content= "text/html; charset=UTF-8" > <title>標(biāo)題</title> <style type= "text/css" > *{margin: 0 ;padding: 0 ;} form{margin: 0 auto;padding:15px; width: 300px;height:300px;text-align: center;} #submit{padding: 10px} #submit input{width: 50px;height: 24px;} </style> </head> <body> <div class = "wrapper" > <form action= "<%=request.getContextPath()%>/loginDemo" method= "post" > <label>用戶名:</label> <input type= "text" name= "userName" value= "${param.userName}" /><br><br> <label>密碼:</label> <input type= "password" name= "password" /><br> <font color= "red" > <% if (request.getAttribute( "message" )!= null ){ out.print(request.getAttribute( "message" )); } %> </font> <div id= "submit" > <input type= "submit" value= "登錄" /> </div> </form> </div> </body> </html> |
2.hello.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<%@ page language= "java" contentType= "text/html; charset=UTF-8" pageEncoding= "UTF-8" %> <!DOCTYPE html> <html> <head> <meta http-equiv= "Content-Type" content= "text/html; charset=UTF-8" > <title>標(biāo)題</title> </head> <body> Hello:<br> <font color= "green" size= "22" > <% out.print(request.getParameter( "userName" )+ "<br>" ); %> </font> <a href= "<%=request.getContextPath()%>/loginDemo/login.jsp" >重新登錄</a> </body> </html> |
3.對應(yīng)的LoginServlet.java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
package loginDemo; import java.io.IOException; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class LoginServlet extends HttpServlet { private static final long serialVersionUID = 1L; protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String userName = request.getParameter( "userName" ); String password = request.getParameter( "password" ); System.err.println(userName+ ";" +password); String myUser = "Dong" ; String myPwd = "5432100" ; if (userName.equals(myUser)&&password.equals(myPwd)) { response.sendRedirect(request.getContextPath()+ "/loginDemo/hello.jsp?userName=" +userName); } else { request.setAttribute( "message" , "賬密錯誤,請重新登錄<br>" ); request.getRequestDispatcher( "/loginDemo/login.jsp" ).forward(request, response); } } } |
4.對應(yīng)的web.xml的配置(注冊)與映射
1
2
3
4
5
6
7
8
|
< servlet > < servlet-name >logindemo</ servlet-name > < servlet-class >loginDemo.LoginServlet</ servlet-class > </ servlet > < servlet-mapping > < servlet-name >logindemo</ servlet-name > < url-pattern >/loginDemo</ url-pattern > </ servlet-mapping > |
到此這篇關(guān)于jsp+servlet實現(xiàn)簡單登錄頁面功能(附demo)的文章就介紹到這了,更多相關(guān)jsp+servlet登錄頁面內(nèi)容請搜索服務(wù)器之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持服務(wù)器之家!
原文鏈接:https://blog.csdn.net/qq_37306786/article/details/80484200