IT俱乐部 Jsp 使用JSP实现简单的用户登录注册页面示例代码解析

使用JSP实现简单的用户登录注册页面示例代码解析

实验要求:

将实验2中的系统用户登录和注册页面改为JSP页面,并部署自己的Web应用于Tomcat服务器中

具体要求:

完成登录JSP页面设计和注册页面设计

在登录页面表单中使用request对象获取用户信息,建立新的JSP页面完成登录验证(用户名和密码自己指定即可)。

验证结果显示(如登录成功/用户名密码错误,可以使用JavaScript,也可以使用新的JSP页面)。

在注册页面表单中使用request对象获取用户注册信息(注册项目由自己指定),在新的JSP页面显示用户注册信息,并提示注册成功。

代码

登录页面index.html

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>jsp作业</title><link href="css/bootstrap.min.css" rel="external nofollow"><nav class="navbar navbar-default"><div class="container-fluid">
  <div class="navbar-header">
   <a class="navbar-brand" href="./" rel="external nofollow">jsp作业</a>
  </div>
  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
   <ul class="nav navbar-nav navbar-right">
<li><a href="login.jsp" rel="external nofollow">登录</a></li>
   </ul>
</div>
 </div>
</nav><div class="container">
 <div class="jumbotron">
  <h1>Hello, world!</h1>
  <p>这是一个jsp作业</p>
 </div>
</div>

登录页面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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
<meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>登录</title><link href="css/bootstrap.min.css" rel="external nofollow"><nav class="navbar navbar-default"><div class="container-fluid">
  <div class="navbar-header">
   <a class="navbar-brand" href="./" rel="external nofollow">jsp作业</a>
  </div>
  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
   <ul class="nav navbar-nav navbar-right">
<li><a href="login.jsp" rel="external nofollow">登录</a></li>
   </ul>
</div>
 </div>
</nav><div class="container">
 <div class="row">
  <div class="col-md-4">
 
  </div>
  <div class="col-md-4">
   <form class="form-signin" method="post" action="login-check.jsp">
    <h2 class="form-signin-heading">登录到jsp作业</h2>
    <label for="">用户名</label>
    <input type="text" name="username" id="username" class="form-control" placeholder="请输入用户名" required="" autofocus=""><br><label for="">密码</label>
    <input type="password" name="password" id="password" class="form-control" placeholder="请输入密码" required=""><div class="checkbox">
     <label>
      <input type="checkbox" value="remember-me" checked=""> 记住密码
     </label>
    </div>
    <button type="submit" class="btn btn-primary" id="btn-login">登录</button>
    <a href="reg.jsp" rel="external nofollow" class="btn btn-default">注册</a>
   </form>
  </div>
  <div class="col-md-4">
  </div>
 </div>
 
 
 
</div>
<p>登录结果页面login-check.jsp</p>
<div class="jb51code">
<pre class="brush:xhtml;">
 
 
 <meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>登录</title><link href="css/bootstrap.min.css" rel="external nofollow"><nav class="navbar navbar-default"><div class="container-fluid">
  <div class="navbar-header">
   <a class="navbar-brand" href="./" rel="external nofollow">jsp作业</a>
  </div>
  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
   <ul class="nav navbar-nav navbar-right">
<li><a href="login.jsp" rel="external nofollow">登录</a></li>
   </ul>
</div>
 </div>
</nav><div class="container">
 <div class="row">
  <div class="col-md-4">
 
  </div>
  <div class="col-md-4">
   <form class="form-signin" method="post" action="login-check.jsp">
    <h2 class="form-signin-heading">登录到jsp作业</h2>
    <label for="">用户名</label>
    <input type="text" name="username" id="username" class="form-control" placeholder="请输入用户名" required="" autofocus=""><br><label for="">密码</label>
    <input type="password" name="password" id="password" class="form-control" placeholder="请输入密码" required=""><div class="checkbox">
     <label>
      <input type="checkbox" value="remember-me" checked=""> 记住密码
     </label>
    </div>
    <button type="submit" class="btn btn-primary" id="btn-login">登录</button>
    <a href="reg.jsp" rel="external nofollow" class="btn btn-default">注册</a>
   </form>
  </div>
  <div class="col-md-4">
  </div>
 </div>
 
 
 
</div>
<p>注册页面reg.jsp</p>
<div class="jb51code">
<pre class="brush:xhtml;">
 
 
 <meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>注册</title><link href="css/bootstrap.min.css" rel="external nofollow"><nav class="navbar navbar-default"><div class="container-fluid">
  <div class="navbar-header">
   <a class="navbar-brand" href="./" rel="external nofollow">jsp作业</a>
  </div>
  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
   <ul class="nav navbar-nav navbar-right">
<li><a href="login.jsp" rel="external nofollow">登录</a></li>
   </ul>
</div>
 </div>
</nav><div class="container">
 <div class="row">
  <div class="col-md-4">
  </div>
  <div class="col-md-4">
 
   <form class="form-signin" action="reg-submit.jsp" method="post">
    <h2 class="form-signin-heading">注册到jsp作业</h2>
    <div id="info">
 
    </div>
    <label for="">用户名</label>
    <input type="text" name="username" id="username" class="form-control" placeholder="请输入用户名" required="" autofocus=""><br><label for="">密码</label>
    <input type="password" name="password" id="password" class="form-control" placeholder="请输入密码" required=""><br><label for="">重复密码</label>
    <input type="password" name="password2" id="password2" class="form-control" placeholder="请再次输入密码" required="" maxlength="16"><br><button type="submit" class="btn btn-primary" id="btn-reg">注册</button>
    <a href="login.jsp" rel="external nofollow" class="btn btn-default" id="btn-reg">返回登录</a>
   </form>
  </div>
  <div class="col-md-4">
  </div>
 </div>
 
 
 
</div>
<p>注册结果页面reg-submit.jsp</p>
<div class="jb51code">
<pre class="brush:xhtml;">
 
 
 <meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>结果</title><link href="css/bootstrap.min.css" rel="external nofollow"><nav class="navbar navbar-default"><div class="container-fluid">
  <div class="navbar-header">
   <a class="navbar-brand" href="./" rel="external nofollow">jsp作业</a>
  </div>
  <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
   <ul class="nav navbar-nav navbar-right">
<li><a href="login.jsp" rel="external nofollow">登录</a></li>
   </ul>
</div>
 </div>
</nav><div class="container">
  
 注册成功</div>");
  out.println("</pre>
<ul class="list-group">");<br>
  out.println("<p></p>
<li class="list-group-item">用户名:" + username + "</li>
<p>");<br>
  out.println("</p>
<li class="list-group-item">密码:" + password + "</li>
<p>");<br>
  out.println("</p></ul>
<p>");<br>
 }<br>
 else{<br>
  out.println("</p>
<div class="alert alert-danger" role="alert">两次密码输入不一致,请重新输入</div>
<p>");<br>
 }<br>
 %></p>
</div>
</pre></div>
<p><span style="color: #ff0000"><strong>效果 </strong></span></p>
<p style="text-align: center"><img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-1413bc1229321e19689e4f65d379aecc.png"></p>
<p style="text-align: center"><img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-e33f3cac2c3968d6c0ca90574055b699.png"></p>
<p style="text-align: center"><img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-3e5eafef7bbb88ee53197ef02ac5b58f.png"></p>
<p style="text-align: center"><img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-7567886975110c952f1120e658f4465e.png"></p>
<p style="text-align: center"><img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-afe6f69ccee9f9eec2cd61548986720f.png"></p>
<p style="text-align: left">到此这篇关于使用JSP实现简单的用户登录注册页面示例代码解析的文章就介绍到这了,更多相关JSP实现简单的用户登录注册页面内容请搜索IT俱乐部以前的文章或继续浏览下面的相关文章希望大家以后多多支持IT俱乐部!</p>
</pre></div>
<div class="lbd_bot clearfix">
                            <span id="art_bot" class="jbTestPos"></span>
                        </div>
<div class="tags clearfix">
                            <i class="icon-tag"></i><p></p>
<ul class="meta-tags">
<li class="tag item"><a href="http://common.jb51.net/tag/JSP/1.htm" target="_blank" title="搜索关于JSP的文章" rel="nofollow noopener">JSP</a></li>
<li class="tag item"><a href="http://common.jb51.net/tag/%E7%99%BB%E5%BD%95/1.htm" target="_blank" title="搜索关于登录的文章" rel="nofollow noopener">登录</a></li>
<li class="tag item"><a href="http://common.jb51.net/tag/%E6%B3%A8%E5%86%8C/1.htm" target="_blank" title="搜索关于注册的文章" rel="nofollow noopener">注册</a></li>
</ul>
</div>
<div class="lbd clearfix">
                            <span id="art_down" class="jbTestPos"></span>
                        </div>
<div id="shoucang"></div>
<div class="xgcomm clearfix">
<h2>相关文章</h2>
<ul>
<li class="lbd clearfix"><span id="art_xg" class="jbTestPos"></span></li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/129598.htm" title="JSP页面跳转方法大全" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-1a1b05c64693fbf380aa1344a7812747.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/129598.htm" title="JSP页面跳转方法大全" rel="noopener">JSP页面跳转方法大全</a></p>
<div class="item-info">
<div class="js">这篇文章主要介绍了JSP页面跳转的多种方法,包换在JSP脚本中直接跳转,利用前端HTML,JS实现跳转</div>
<p><span class="lbtn" style="float:right"> 2017-12-12 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/45826.htm" title="servlet实现文件下载的实用类分享" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-4f55910a645b073bc4fc65dc10dc14bd.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/45826.htm" title="servlet实现文件下载的实用类分享" rel="noopener">servlet实现文件下载的实用类分享</a></p>
<div class="item-info">
<div class="js">servlet文件下载类,为了防止客户端浏览器直接打开目标文件,在响应头里加入强制下载的MIME类型,大家参考使用吧</div>
<p><span class="lbtn" style="float:right"> 2014-01-01 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/186540.htm" title="JSP登录中Session的用法实例详解" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-0ea3c7666119d5615e582f823fb3fad6.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/186540.htm" title="JSP登录中Session的用法实例详解" rel="noopener">JSP登录中Session的用法实例详解</a></p>
<div class="item-info">
<div class="js">这篇文章主要介绍了JSP登录中Session的用法,结合实例形式详细分析了JSP登录中使用Session的具体操作技巧与注意事项,需要的朋友可以参考下</div>
<p><span class="lbtn" style="float:right"> 2020-05-05 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/18918.htm" title="jsp 重复提交问题" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-4f96a78db829b1556ff16de21e013c7a.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/18918.htm" title="jsp 重复提交问题" rel="noopener">jsp 重复提交问题</a></p>
<div class="item-info">
<div class="js"></div>
<p><span class="lbtn" style="float:right"> 2009-07-07 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/46956.htm" title="在jsp页面如何获得url参数" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-8cc1031babc6aff2319f1c6af8544aa0.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/46956.htm" title="在jsp页面如何获得url参数" rel="noopener">在jsp页面如何获得url参数</a></p>
<div class="item-info">
<div class="js">这篇文章主要介绍了在jsp页面获得url参数的方法,需要的朋友可以参考下</div>
<p><span class="lbtn" style="float:right"> 2014-02-02 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/82422.htm" title="详解JSP中的语句对象Statement操作MySQL的使用实例" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-0c932a99bb7b6f23c937db507070cc7b.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/82422.htm" title="详解JSP中的语句对象Statement操作MySQL的使用实例" rel="noopener">详解JSP中的语句对象Statement操作MySQL的使用实例</a></p>
<div class="item-info">
<div class="js">这篇文章主要介绍了JSP中的语句对象Statement操作MySQL的使用实例,讲解了添加记录、更新记录、删除记录三种操作,说明都在代码注释中简单明了,需要的朋友可以参考下</div>
<p><span class="lbtn" style="float:right"> 2016-04-04 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/73909.htm" title="JSP页面中超链接传递中文参数出现乱码问题解决方法" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-cca732bf65a93ed2ec0ac80c638460fe.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/73909.htm" title="JSP页面中超链接传递中文参数出现乱码问题解决方法" rel="noopener">JSP页面中超链接传递中文参数出现乱码问题解决方法</a></p>
<div class="item-info">
<div class="js">这篇文章主要介绍了JSP页面中超链接传递中文参数出现乱码问题解决方法,涉及jsp页面参数传递与字符串处理技巧,具有一定参考借鉴价值,需要的朋友可以参考下</div>
<p><span class="lbtn" style="float:right"> 2015-10-10 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/105314.htm" title="JSP中EL表达式的用法详解(必看篇)" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-2d9f31f2af7b675a3d153d2b7f1035a7.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/105314.htm" title="JSP中EL表达式的用法详解(必看篇)" rel="noopener">JSP中EL表达式的用法详解(必看篇)</a></p>
<div class="item-info">
<div class="js">下面小编就为大家带来一篇JSP中EL表达式的用法详解(必看篇)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧</div>
<p><span class="lbtn" style="float:right"> 2017-02-02 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/239347.htm" title="解决request.getParameter取值后的if判断为NULL的问题" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-b452cee8ec5cd9e58ab98eba17281e59.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/239347.htm" title="解决request.getParameter取值后的if判断为NULL的问题" rel="noopener">解决request.getParameter取值后的if判断为NULL的问题</a></p>
<div class="item-info">
<div class="js">这篇文章主要介绍了解决request.getParameter取值后的if判断为NULL的问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教</div>
<p><span class="lbtn" style="float:right"> 2022-03-03 </span>
</p></div>
</div>
</div>
</div>
</li>
<li>
<div class="item-inner">
<a href="https://www.2it.club/article/16480.htm" title="hibernate更新数据方法小结" class="img-wrap" target="_blank" rel="noopener"> <img decoding="async" src="https://www.2it.club/wp-content/uploads/2023/02/frc-f4838ec7e2d4da28e0b57d4e852dadd4.png"></a><p></p>
<div class="rbox">
<div class="rbox-inner">
<p><a class="link title" target="_blank" href="https://www.2it.club/article/16480.htm" title="hibernate更新数据方法小结" rel="noopener">hibernate更新数据方法小结</a></p>
<div class="item-info">
<div class="js">session.update不能直接用,因为他是以ID为主键,必须查询出ID才能进行更新。。。<p></p>
</div>
<p><span class="lbtn" style="float:right"> 2008-11-11 </span>
</p></div>
</div>
</div>
</div>
</li>
</ul>
</div>
<div class="lbd clearfix mt5">
                            <span id="art_down2" class="jbTestPos"></span>
                        </div>
<p>                        <a href=""></a></p>
<div id="comments">
<h2>最新评论</h2>
<div class="pd5">
<div id="SOHUCS" sid="art_192647"></div>
<p></p></div>
<p></p></div>
本文收集自网络,不代表IT俱乐部立场,转载请注明出处。https://www.2it.club/code/jsp/2782.html
上一篇
下一篇
联系我们

联系我们

在线咨询: QQ交谈

邮箱: 1120393934@qq.com

工作时间:周一至周五,9:00-17:30,节假日休息

关注微信
微信扫一扫关注我们

微信扫一扫关注我们

返回顶部