Web开发技术---简单的登录验证

制作一个APP或系统最基础的是登录界面，下面通过一个简单的登录注册界面的程序，来熟练掌握Web开发的技术。

一、知识点：

1.在网页界面获取用户的输入信息

2.标签的基本应用

3.用户输入结果的错误提示

4.在处理输入错误时，对用户的输入结果进行保留显示及对应错误栏清空。

二、标签

<form>该标签为表单标签，用于形成标签</form>

<input>该标签为输入标签，具体的使用根据定义的属性显示，具体参考文章源代码的注释

<selsct>下拉框标签</select>

三、Web内置对象的使用

1.获取网页用户输入信息request.getParameter（）；

2.转发网页request.getRequestDispatcher("注册页.jsp").forward(request, response)；

3.接收网页转发request.getAttribute（）；

四、源代码解析

1.注册页.jsp

该文件代码用于生成用户输入界面的输入表单，并接收注册界面.jsp文件转发过来的错误处理提示。

1.1输入表单的源代码

 <html>

     <head>

         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

         <title>JSP Page</title>

     </head>

     <body>

         <h1>个人信息</h1>

         <form action="注册界面.jsp">

             用户：<input type="text" name="username" <%if(n!=null){%> value="<%=n%>" <%}%>/>

           <%

      //出错处理

            if(error !=null && error.equals("用户名未输入"))

             {

              out.println(error);

              // out.println("<font color="red">"+error+"</font>");

             }

           %>

             <br> <br>

             邮箱：<input type="text" name="email" value="123456789@qq.com"/>

              <%

             if(error1 !=null)

             {

                 out.println(error1);

                 // out.println("<font color="red">"+error+"</font>");

             }

             %>

              <br> <br>

             密码：<input type="password" name="password"/>

              <%

             if(error2 !=null)

             {

                 out.println(error2);

                 // out.println("<font color="red">"+error+"</font>");

             }

             %>

             <br><br>

             确认密码：<input type="password" name="password1"/>

             <%

             if(error3 !=null)

             {

                 out.println(error3);

                 // out.println("<font color="red">"+error+"</font>");

             }

             %>

             <%

             if(error4 !=null)

             {

                 out.println(error4);

                 // out.println("<font color="red">"+error+"</font>");

             }

             %>

             <br> <br>

             性别：

            <input type="radio" name="sex" value="0"/>男

            <input type="radio" name="sex" value="1"/>女

             <br><br>

             <!--复选框-->

             爱好：

            <input type="checkbox" name="1" value="音乐"/>音乐

            <input type="checkbox" name="1" value="美术"/>美术

            <input type="checkbox" name="1" value="动漫"/>动漫

            <input type="checkbox" name="1" value="电竞"/>电竞

            <input type="checkbox" name="1" value="编程"/>编程

            <br><br>

            <!--下拉框:-->

            班级：<select name="class">

                <option value="1701班">1701班</option>

                <option value="1702班">1702班</option>

                <option value="1703班">1703班</option>

                <option value="1704班">1704班</option>

                <option value="1705班">1705班</option>

                <option value="1706班">1706班</option>

                <option value="1707班">1707班</option>

            </select>

            <br>

            <p>个人说明：</p>

            <textarea name="p"rows="4" cols="20">填写个人说明</textarea>

            <br><br>

             <input type="reset"value="重置">

            <input type="submit"value="提交">

            <br><br>

         </form>

     </body>

 </html>

1.1.1运行结果

1.2接收错误处理信息的代码

 <%@page import="java.net.URLEncoder"%>

 <%@page contentType="text/html" pageEncoding="UTF-8"%>

 <%

     //接收

     String error =(String)request.getAttribute("error");

     String error1 =(String)request.getAttribute("error1");

     String error2 =(String)request.getAttribute("error2");

     String error3 =(String)request.getAttribute("error3");

     String error4 =(String)request.getAttribute("error4");

     String n =(String)request.getAttribute("n");

 %>

2.注册界面.jsp

该文件代码用于输出获得的用户输入信息，并对获取的信息进行错误处理，把处理结果转发至用户输入界面。

2.1输出信息页面代码

 <html>

     <head>

         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

         <title>JSP Page</title>

     </head>

     <body>

          <h1>个人信息</h1>

            用户：<%=name%>

            <br><br>

             邮箱：<%=email%>

            <br><br>

             密码：<%=password%>

            <br><br>

            确认密码：<%=password1%>

            <br><br>

            班级：<%=banji%>

            <br><br>

            爱好：<%for(int i = 0;i<str.length;i++){%>

            <%=str[i]%>

            <%}%>

            <br><br>

            个人说明：<%=request.getParameter("p")%>

     </body>

 </html>

2.1.1运行结果

用户界面提交信息后的显示界面 ：

2.2错误处理代码

在这里只举出部分错误处理的例子，供读者对该知识的理解。该代码应该与注册页.jsp的代码联合，方便解读。

 <%

     request.setCharacterEncoding("UTF-8");

 //接收用户输入信息

     String n=request.getParameter("username");

     String p=request.getParameter("password");

     String p1=request.getParameter("password1");

     if(n.equals("")){

         request.setAttribute("error", "用户名未输入");

         request.getRequestDispatcher("注册页.jsp").forward(request, response);

     }

     else if(request.getParameter("email").equals(""))

     {

 //用于在出现错误处理时，用户输入的信息仍然保存，并显示

         request.setAttribute("n", n);

         request.setAttribute("p", p);

         request.setAttribute("p1", p1);

         request.setAttribute("error1", "邮箱未输入");

         request.getRequestDispatcher("注册页.jsp").forward(request, response);

     }

     else if(request.getParameter("password").equals(""))

     {

         request.setAttribute("n", n);

         request.setAttribute("error2", "密码未输入");

         request.getRequestDispatcher("注册页.jsp").forward(request, response);

     }

     else if(request.getParameter("password1").equals(""))

     {

         request.setAttribute("n", n);

          request.setAttribute("p", p);

         request.setAttribute("error3", "确认密码未输入");

         request.getRequestDispatcher("注册页.jsp").forward(request, response);

     }

    else if(request.getParameter("password1")!=request.getParameter("password"))

     {

         request.setAttribute("n", n);

         request.setAttribute("p", p);

         request.setAttribute("error4", "确认密码与密码不一致！");

        request.getRequestDispatcher("注册页.jsp").forward(request, response);

    }

 %>

2.2.1部分运行结果如下：

用户名未输入：

密码未输入：

确认密码未输入：

密码与确认密码不一致：

3.小扩展

在程序中插入调用当前时间的函数代码，记录注册的时间

3.1时间代码

 <%

 //    代码块

     Date date = new Date();

     SimpleDateFormat simpledate = new SimpleDateFormat("yyyy年MM月dd日 E HH 点mm分ss秒");

     String strDate = simpledate.format(date);

 %>

3.2显示时间

 注册时间：<%=date%>

             <br>

         <%=strDate%>

4.完整运行成功后的结果

Web开发技术---简单的登录验证的更多相关文章

.NET Web开发技术简单整理转
.NET Web开发技术简单整理原文:http://www.cnblogs.com/SanMaoSpace/p/3157293.html 在最初学习一些编程语言.一些编程技术的时候,做的更多的是如何 ...
.NET Web开发技术简单整理
在最初学习一些编程语言.一些编程技术的时候,做的更多的是如何使用该技术,如何更好的使用该技术解决问题,而没有去关注它的相关性.关注它的理论支持,这种学习技术的方式是短平快.其实工作中有时候也是这样,公 ...
转载：.NET Web开发技术简单整理
在最初学习一些编程语言.一些编程技术的时候,做的更多的是如何使用该技术,如何更好的使用该技术解决问题,而没有去关注它的相关性.关注它的理论支持,这种学习技术的方式是短平快.其实工作中有时候也是这样,公 ...
.Net Web开发技术栈
有很多朋友有的因为兴趣,有的因为生计而走向了.Net中,有很多朋友想学,但是又不知道怎么学,学什么,怎么系统的学,为此我以我微薄之力总结归纳写了一篇.Net web开发技术栈,以此帮助那些想学,却不知 ...
通俗易懂，什么是.NET?什么是.NET Framework？什么是.NET Core? .Net Web开发技术栈
通俗易懂,什么是.NET?什么是.NET Framework?什么是.NET Core? 什么是.NET?什么是.NET Framework?本文将从上往下,循序渐进的介绍一系列相关.NET的概念 ...
.Net Web开发技术栈收藏
原文:http://www.cnblogs.com/1996V/p/7700087.html#!comments 有很多朋友有的因为兴趣,有的因为生计而走向了.Net中,有很多朋友想学,但是又不知道怎 ...
Web开发技术发展历史
Web开发技术发展历史来自:天码营原文:http://www.tianmaying.com/tutorial/web-history Web的诞生提到Web,不得不提一个词就是"互 ...
【转载】Web开发技术发展历史-版本1
原文在这里. Web开发技术发展历史 Web的诞生提到Web,不得不提一个词就是“互联网”.Web是World Wide Web的简称,中文译为万维网.“万维网”和我们经常说的“互联网”是两个联系极 ...
基于gin的golang web开发：实现用户登录
前文分别介绍过了Resty和gin-jwt两个包,Resty是一个HTTP和REST客户端,gin-jwt是一个实现了JWT的Gin中间件.本文将使用这两个包来实现一个简单的用户登录功能. 环境准备 ...

随机推荐

Google深度学习开源框架TenseorFlow安装
Google近期发布了TensorFlow,考录到Google出品,必属精品,估计这玩意会火,不过火钳刘明已经来不及了今天才想着安装来试试 TensorFlow官网:https://www.tens ...
【vim小记】自动保存配置
刚接触vim会发现有很多不习惯,其中,不能自动保存当前配置,每次退出要重新配置,很麻烦,好在vim早就为我们想到这些,在看手册的时候,发现里面有session, 这是用户手册的介绍: “会话保存所有 ...
Spring笔记3
动态代理** 特点:字节码随用随创建,随用随加载作用:不修改源码的基础上对方法增强分类: 基于接口的动态代理基于子类的动态代理基于接口的动态代理: 涉及的类:Proxy 如何创建代理对 ...
centos7编译安装memcached
1.libevent 源码地址:https://github.com/libevent/libevent/releases/download/release-2.1.8-stable/libevent ...
『Go基础』第7节变量
1. 什么是变量? 我们应该怎么去理解变量? 在这里我要举一个例子: 大家应该都知道王者荣耀这个游戏. 当我们在玩王者荣耀的时候, 我们操控的英雄的血量是不断变化的, 这个血量是存在内存中的. 那么这 ...
Tkinter & mysql 的登录框练习
import tkinter as tk from tkinter import messagebox import pymysql class SignIn(object): def __init_ ...
Python爬虫快速上手教程
1 这个是什么整理Python中requests常用的API 2 代码 from bs4 import BeautifulSoup import requests import re ...
C# 文件类中 File ，FileInfo 类的主要区别
System.IO命名空间中提供的文件操作类有File和FileInfo,这两个类的功能基本相同,只是File是静态类,其中所有方法都是静态的,可以通过类名直接调用,不需要实例化.而FileInfo是 ...
学习笔记之CloudCompare
CloudCompare - Open Source project https://www.danielgm.net/cc/ 3D point cloud and mesh processing s ...
CSSTab栏下划线跟随效果
神奇的 ~ 选择符对于当前 hover 的 li ,其对应伪元素的下划线的定位是 left: 100%,而对于 li:hover ~ li::before,它们的定位是 left: 0. ul li ...

Web开发技术---简单的登录验证

Web开发技术---简单的登录验证的更多相关文章

随机推荐

热门专题