Eclipse创建Maven WebApp项目JSP-SERVLET 中带有会话的登录表单

拼搏现实的明天。 2023-09-30 08:51 75阅读 0赞

#### **创建 Maven 项目** ####

在 Eclipse 上，创建一个**Maven**项目

![3ff20556c558983b1918bb5d1bd4ba31.png][]

单击**下一步**按钮以选择项目的**工作区位置**

![35ab12fb13e26e8205f1feaf2ae8a19e.png][]

单击**下一步**按钮为项目选择**Archetype**

![64888a38766ffb008846d1b8291839c4.png][]

单击**下一步**按钮并输入**项目信息**：

*  **组 ID**：LearnJSPServletWithRealApps
 *  **工件 ID**：LearnJSPServletWithRealApps
 *  **包**：com.demo

![ae7f7ce9aa2d72d7fe484648eefd9bd5.png][]

点击**Finish**按钮完成创建 Maven 项目

#### **配置 pom.xml** ####

<project xmlns="http://maven.apache.org/POM/4.0.0"
    	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
    	<modelVersion>4.0.0</modelVersion>
    	<groupId>LearnJSPServletWithRealApps</groupId>
    	<artifactId>LearnJSPServletWithRealApps</artifactId>
    	<packaging>war</packaging>
    	<version>0.0.1-SNAPSHOT</version>
    	<name>Learn JSP-Servlet with Real Apps</name>
    	<url>http://maven.apache.org</url>
    	<dependencies>
    		<dependency>
    			<groupId>junit</groupId>
    			<artifactId>junit</artifactId>
    			<version>3.8.1</version>
    			<scope>test</scope>
    		</dependency>
    		<dependency>
    			<groupId>javax.servlet.jsp.jstl</groupId>
    			<artifactId>javax.servlet.jsp.jstl-api</artifactId>
    			<version>1.2.1</version>
    		</dependency>
    		<dependency>
    			<groupId>taglibs</groupId>
    			<artifactId>standard</artifactId>
    			<version>1.1.2</version>
    		</dependency>
    		<dependency>
    			<groupId>javax.servlet</groupId>
    			<artifactId>javax.servlet-api</artifactId>
    			<version>3.1.0</version>
    			<scope>provided</scope>
    		</dependency>
    	</dependencies>
    	<build>
    		<finalName>LearnJSPServletWithRealApps</finalName>
    	</build>
    </project>

#### **配置 web.xml** ####

<!DOCTYPE web-app PUBLIC
     "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
     "http://java.sun.com/dtd/web-app_2_3.dtd" >
    
    <web-app>
     	<welcome-file-list>
     		<welcome-file>index.jsp</welcome-file>
     	</welcome-file-list>
    </web-app>

#### **重定向页面** ####

在**src\\main\\webapp**文件夹中创建名为**index.jsp**的新 JSP 文件。该文件将重定向到**AccountServlet**，如下所示：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    	pageEncoding="ISO-8859-1"%>
    <jsp:forward page="account"></jsp:forward>

#### **创建 Servlet** ####

创建名为**com.demo.servlets**的新包。在这个包中，创建一个名为**AccountServlet的新****Servlet**，如下所示：

package com.demo.servlets;
    
    import java.io.IOException;
    
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import javax.servlet.http.HttpSession;
    
    @WebServlet("/account")
    public class AccountServlet extends HttpServlet {
    
    	private static final long serialVersionUID = 1L;
    
    	public AccountServlet() {
    		super();
    	}
    
    	protected void doGet(HttpServletRequest request, HttpServletResponse response)
    			throws ServletException, IOException {
    		HttpSession session = request.getSession();
    		String action = request.getParameter("action");
    		if (action == null) {
    			request.getRequestDispatcher("account/index.jsp").forward(request, response);
    		} else {
    			if (action.equalsIgnoreCase("logout")) {
    				session.removeAttribute("username");
    				response.sendRedirect("account");
    			}
    		}
    	}
    
    	protected void doPost(HttpServletRequest request, HttpServletResponse response)
    			throws ServletException, IOException {
    		HttpSession session = request.getSession();
    		String username = request.getParameter("username").trim();
    		String password = request.getParameter("password").trim();
    		if (username.equalsIgnoreCase("acc1") && password.equalsIgnoreCase("123")) {
    			session.setAttribute("username", username);
    			request.getRequestDispatcher("account/welcome.jsp").forward(request, response);
    		} else {
    			request.setAttribute("error", "Invalid Account");
    			request.getRequestDispatcher("account/index.jsp").forward(request, response);
    		}
    	}
    
    }

#### **创建 JSP 页面** ####

在**src\\main\\webapp**文件夹中创建名为**account**的新文件夹。在此文件夹中，创建新的**JSP**文件，如下所示：

**索引 JSP**

在**src\\main\\webapp\\account**文件夹中，创建名为**index.jsp的新****JSP**文件，如下所示：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    	pageEncoding="ISO-8859-1" isELIgnored="false"%>
    <html>
    <head>
    <title>Demo Page</title>
    </head>
    <body>
    
    	<h3>Login Page</h3>
    	${error }
    	<form method="post" action="${pageContext.request.contextPath }/account">
    		<table border="0" cellpadding="2" cellspacing="2">
    			<tr>
    				<td>Username</td>
    				<td><input type="text" name="username"></td>
    			</tr>
    			<tr>
    				<td>Password</td>
    				<td><input type="password" name="password"></td>
    			</tr>
    			<tr>
    				<td> </td>
    				<td><input type="submit" value="Login"></td>
    			</tr>
    		</table>
    	</form>
    
    </body>
    </html>

**欢迎 JSP**

在**src\\main\\webapp\\account**文件夹中，创建名为**welcome.jsp的新****JSP**文件，如下所示：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    	pageEncoding="ISO-8859-1" isELIgnored="false"%>
    <html>
    <head>
    <title>Welcome Page</title>
    </head>
    <body>
    
    	<h3>Welcome Page</h3>
    	Welcome ${sessionScope.username }
    	<br>
    	<a href="${pageContext.request.contextPath }/account?action=logout">Logout</a>
    
    </body>
    </html>

#### **Maven项目的结构** ####

![78dabd5df4427322f49867f8dc126776.png][]

#### **运行应用程序** ####

选择项目，右键单击并选择**Run As/Run on Server**菜单

使用以下 url访问**DemoServlet ：**

*  **http://localhost:8081/LearnJSPServletWithRealApps**
 *  **http://localhost:8081/LearnJSPServletWithRealApps/account**

**输出**

![c97f33eb24aa876a47e966c4d4a6d0c1.png][]

使用无效帐户进行测试是**用户名：abc**和**密码：123**

**输出**

![130f055bb849f1ddaf04b27981d74f9c.png][]

![6aef8ccf97b07139742cb989fa299fcf.png][]

使用有效帐户进行测试是**username: acc1**和**password: 123**。

**输出**

![f805e5a59be9de22efc86187dc716130.png][]

![c4af7481b36338775b58ed6145e661a5.png][]

单击欢迎页面中的**注销**链接以删除会话并再次打开登录页面

**输出**

![c97f33eb24aa876a47e966c4d4a6d0c1.png][]

[3ff20556c558983b1918bb5d1bd4ba31.png]: https://img-blog.csdnimg.cn/img_convert/3ff20556c558983b1918bb5d1bd4ba31.png
[35ab12fb13e26e8205f1feaf2ae8a19e.png]: https://img-blog.csdnimg.cn/img_convert/35ab12fb13e26e8205f1feaf2ae8a19e.png
[64888a38766ffb008846d1b8291839c4.png]: https://img-blog.csdnimg.cn/img_convert/64888a38766ffb008846d1b8291839c4.png
[ae7f7ce9aa2d72d7fe484648eefd9bd5.png]: https://img-blog.csdnimg.cn/img_convert/ae7f7ce9aa2d72d7fe484648eefd9bd5.png
[78dabd5df4427322f49867f8dc126776.png]: https://img-blog.csdnimg.cn/img_convert/78dabd5df4427322f49867f8dc126776.png
[c97f33eb24aa876a47e966c4d4a6d0c1.png]: https://img-blog.csdnimg.cn/img_convert/c97f33eb24aa876a47e966c4d4a6d0c1.png
[130f055bb849f1ddaf04b27981d74f9c.png]: https://img-blog.csdnimg.cn/img_convert/130f055bb849f1ddaf04b27981d74f9c.png
[6aef8ccf97b07139742cb989fa299fcf.png]: https://img-blog.csdnimg.cn/img_convert/6aef8ccf97b07139742cb989fa299fcf.png
[f805e5a59be9de22efc86187dc716130.png]: https://img-blog.csdnimg.cn/img_convert/f805e5a59be9de22efc86187dc716130.png
[c4af7481b36338775b58ed6145e661a5.png]: https://img-blog.csdnimg.cn/img_convert/c4af7481b36338775b58ed6145e661a5.png