用JSP做个简单的登录注册页面

用JSP做个简单的登录注册页面第一步先分析整个过程，然后得出大概思路。首先，进入登录页面（login.jsp），如下：我们是没有账号的所以需要注册账号，所以这时候必须有一个注册页面（register.jsp）,如下紧接着注册成功后跳转成功页面，这时我们需要一个注册成功的页面（registersuccess.jsp）,如下：点击返回页面后，我们就可以在登录页面登录，然后登录时有登录成功和登录失败的页

头秃代码奴

89083人浏览 · 2020-10-21 23:49:32

头秃代码奴 · 2020-10-21 23:49:32 发布

用JSP做个简单的登录注册页面

第一步先分析整个过程，然后得出大概思路。
首先，进入登录页面（login.jsp），如下：
在这里插入图片描述
我们是没有账号的所以需要注册账号，所以这时候必须有一个注册页面（register.jsp）,如下

紧接着注册成功后跳转成功页面，这时我们需要一个注册成功的页面（registersuccess.jsp）,如下：

点击返回页面后，我们就可以在登录页面登录，然后登录时有登录成功和登录失败的页面。所以还要再写两个（loginsuccess.jsp loginfailure.jsp）如下:
在这里插入图片描述
这就是大概的一个思路了，接下来就是代码问题了。

登录页面代码

<%@ page language="java" contentType="text/html;
charset=utf-8"
    pageEncoding="utf-8"%>
<!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=ISO-utf-8">
<title>登录</title>
<style>
 #a {

    width:50%;
    height:200px;
    border: 1px dashed ;
    background-color:lightyellow;
    text-align:center;
}
body{
background-color:lightblue;
}
</style>
</head>
<body>
<div id="a">
<h1>登录界面</h1>
<form action="check.jsp" method="post">
账号:<input type="text" name="id"/>
<br>
密码:<input type="password"name="password"/>
<br>

<input type="submit" value="login"/>
没有账号？<a href ="register.jsp">注册账号</a>
</form>
</div>
</body>
</html>

注册页面代码

<%@ page language="java" contentType="text/html;
charset=utf-8"
    pageEncoding="utf-8"%>
<!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">
<title>账号注册</title>
</head>
<style>
 #a {
    width:50%;
    height:50%;
    border: 1px dashed ;
    background-color:lightgreen;
    text-align:center;
}

body{
background-color:lightyellow;
}
</style>
<body>
<%--注册框 --%>
<div id="a">
<h1>注册账号</h1>
<form action="registersuccess.jsp"  method="post">
账&nbsp;&nbsp;&nbsp;号:
<input type="text"
name="id">
<br>

密&nbsp;&nbsp;&nbsp;码:
<input type="password"name="password">
<br>

姓名:
<input type="text" name="name">
<br>

手机号:
<input type="text" name="phonenumber">
<br>

<input type="submit" value="注册">

<input type="submit" value="重置">
</form>
</div>
</body>
</html>

注册成功代码


<%@ page language="java" contentType="text/html;
charset=UTF-8"
    pageEncoding="UTF-8"%>
<!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">
<title>注册成功</title>
</head>
<style>
 #a {

    width:50%;
    height:200px;
    border: 1px dashed ;
    background-color:lightyellow;
    text-align:center;
}

</style>
<body>
<div id="a">
<form action="check.jsp"
method="post">
 <%
request.setCharacterEncoding("UTF-8");
   String id=request.getParameter("id");
   session.setAttribute("id", id);
   String name=request.getParameter("name");
   session.setAttribute("name", name);
   String password=request.getParameter("password");
   session.setAttribute("password", password);
 %>
 恭喜您注册成功！<br>
 您的账号为:<%=id %><br>
 您的密码为:<%=password %><br>
 请妥善保管好您的密码！<br>
</form>
<a href="login.jsp"
style="color:#FAAF46 font-size:10px">返回登录页面</a>
</div>
</body>
</html>

登录成功页面

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!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">
<title>登录成功</title>
<style>
body{
background-color:yellow;
}
 #a {
    width:50%;
 height:200px;
 border: 1px dashed ;
    background-color:lightyellow;
    text-align:center;
}
</style>
</head>
<body>
<div id="a">
<h1 align="center">
页面仅供测试。
</h1>
<h2 align="center">登录成功</h2>
</div>
</body>
</html>

登录失败页面

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!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">
<title>登录成功</title>
<style>
body{
background-color:grey;
}
 #a {
    width:50%;
 height:200px;
 border: 1px dashed ;
    background-color:lightyellow;
    text-align:center;
}
</style>
</head>
<body>
<div id="a">
<h1 align="center">
页面仅供测试。
</h1>
<h2 align="center">登录失败</h2>
<h3 align="center"><a href="login.jsp" style="color:#FAAF46 font-size:10px">返回登录页面</a></h3>
</div>
</body>
</html>

在登录时还需要进行检验，看看账号密码是否正确

检查页面（check.jsp）主要代码（在body里面写）

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!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=ISO-utf-8">
<title>check</title>
</head>
<body>
<form method="post" action="">
<% 
   String id=(String)session.getAttribute("id");
   String password=(String)session.getAttribute("password");
   String name=request.getParameter("id");
   session.setAttribute("name", name);
   String password1=request.getParameter("password");
   session.setAttribute("password", password1);
if(id.equals(name)&&password1.equals(password))
{ response.sendRedirect("loginsuccess.jsp");}
else
response.sendRedirect("loginfailure.jsp");
%>
</form>
</body>
</html>