简单WEB登录页面代码实现

article/2025/10/3 0:55:06

longin.html：登录页面，此处action引用**/**类型的地址，JSP可以用${ pageContext.request.contextPath }/LS
登录页面展示，比较丑，看代码即可

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head><body><form action="/lianxiti/LS"，method="post">用户名: <input name="username" type="text" /><br/>密码：<input name="password" type="password" /><br/>	<input type="submit" value="提交" id="bt" /></form></body>

LoginServlet.java用户和前台WEB页面数据进行交互

package it.tongyou.web.servlet;import java.io.IOException;
import java.io.PrintWriter;import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;public class LoginServlet extends HttpServlet {public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {//乱码解决response.setContentType("text/html;charset-utf-8");//获取页面传过来的数据String username=request.getParameter("username");String password=request.getParameter("password");//判断账号密码if(("xm").equals(username) && ("123").equals(password)){response.sendRedirect("/lianxiti/success.html");}else{response.sendRedirect("/liantixi/longin.html");}}public void doPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {doGet(request, response);}
}

web.xml应用路径配置/LS和longin.html引用地址一定要一样，因为此处需要把WEB页面的数据提交到对应的servlet中；

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"><!-- 页面WEB跳转servlet层 --><servlet><servlet-name>LoginServlet</servlet-name><servlet-class>it.tongyou.web.servlet.LoginServlet</servlet-class></servlet><servlet-mapping><servlet-name>LoginServlet</servlet-name><url-pattern>/LS</url-pattern></servlet-mapping><!-- 打开项目优先展示页面 --> <welcome-file-list><welcome-file>longin.html</welcome-file></welcome-file-list>
</web-app>

成功后跳到success.html页面
登录成功后显示的页面

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head><body>成功登录</body>
</html>