JSP+Servlet+JavaBean+DAO模式+JDBC+Bootstrap+ajax+自定义标签完成用户登录验证

最新推荐文章于 2022-10-21 14:31:44 发布

yQuani

最新推荐文章于 2022-10-21 14:31:44 发布

阅读量1.7k

点赞数 2

分类专栏： Java code 文章标签： java javabean 数据库 jdbc jsp

本文链接：https://blog.csdn.net/Loutslove/article/details/105935730

版权

文章目录一.案例要求二.使用工具工具相关文件的导入三.案例导图四.案例实现1.数据库建立1.1 新建数据库1.2 建表1.3 添加记录2.登录页面实现Bootstrap部署login.jsp实现效果3.JDBC的DAO模式实现3.1 数据库连接类3.2 User实体类-JavaBeanUser特征User代码3.3 UserDAO接口类3.4 UserDAOImpl实现类3.5 UserDAOPr...

摘要由CSDN通过智能技术生成

文章目录

一.案例要求

建库
要求登陆成功进入欢迎页面，显示用户信息（用自定义标签），完成用户信息输出
登录信息不正确回到登录页，并提示错误信息
注册时，用户名不可以重复，用ajax验证
注册成功，写入数据库，并返回登录页面
用户信息修改页面要求用在jsp页面使用Bean完成
各页面注意页面效果，用Bootstrap框架布局

注意：所有jsp页面不可以出现任何java代码

二.使用工具

工具

IDEA、Navicat 15 for MySQL、Tomcat服务器、java开发环境JDK1.8、xmind（思维导图工具）

1.数据库建立

1.1 新建数据库

1.2 建表

1.3 添加记录

### 2.登录页面实现

Bootstrap部署

到Bootstrap下载文件，这里用的是Bootstrap4.4.1

下载好后把bootstrap-4.4.1下的dist文件夹中的两个文件夹复制粘贴到web目录下即可如下图（Bootstrap快速入门）

在这里插入图片描述

login.jsp实现

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><%--导入标准库标签的包--%>
<html>
<head>
    <title>登录界面</title>
    <link href="css/bootstrap.min.css" rel="stylesheet"><%--导入bootstrap的css样式--%>
</head>
<body>
<div class="container"><%--bootstrap的栅格布局--%>
    <h3 style="text-align: center" class="mt-4">用户登录</h3><%--mt调整margin-top--%>
    <form action="${pageContext.request.contextPath}/loginServlet" method="post" class="mt-2 col-lg-5 col-md-3 mr-auto ml-auto"><%--直接从Bootstrap官网复制粘贴过来，修改一下即可--%>
        <div class="form-group"><%--mr-auto和ml-auto是为了使内容居中 col-md-8是指该内容在辨率≥768px的设备中占3个格子 col-lg-4是该内容在分辨率≥992px的设备中占5个格子--%>
            <label for="userName">用户名</label><%--label的作用就是点击标签体内容 焦点给到id为username的输入框--%>
            <input type="text" class="form-control" name="userName" id="userName" placeholder="请输入用户名">
        </div>
        <div class="form-group">
            <label for="userPassword">密码</label>
            <input type="password" class="form-control" id="userPassword" name="userPassword" placeholder="请输入密码">
        </div>
        <hr class="mt-4 mb-4"><%--mt调整margin-top mb是调整margin--bottomde--%>
        <div class="form-group" style="text-align: center"><%--style的属性是为了使两个按钮居中--%>
            <button type="submit" class="btn btn-primary btn-light">登录</button>
            <a href="register.jsp" class="btn btn-primary btn-dark">注册</a>
        </div>
    </form>
    <%--出错显示的信息框--%>
    <c:if test="${not empty errorMes}"><%--如果request域中获取的errorMes不为空则显示下列信息--%>
        <div class="alert alert-warning alert-dismissible fade show col-md-2 col-lg-4 mr-auto ml-auto " role="alert"> <%--Bootstrap的警告框 直接从官网复制代码修改即可--%>
            <strong>出错啦!</strong> <c:out value="${errorMes}"/>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    </c:if>
</div>
<script src="js/bootstrap.min.js"></script><%--导入bootstrap的js--%>
<script src="js/jquery-3.4.1.min.js"></script><%--导入jquery--%>
</body>

效果

3.JDBC的DAO模式实现

3.1 数据库连接类

需要加载的MySQL驱动已在提供的jar包中（mysql-connector-java-8.0.19）

package cn.lot.DB;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.SQLException;

public class MySQLConnection {
    /*加载的驱动程序名*/
    private static final String DRIVER="com.mysql.cj.jdbc.Driver";
    /*配置MySQL时的用户名和密码*/
    private static final String USERNAME="你自己的用户名";
    private static final String PASSWORD="密码";
    /*URL指向访问的数据库名*/
    private static final String URL="jdbc:mysql://localhost:3306/user?serverTimezone=Asia/Shanghai";/*设置为shanghai的时间*/
    /*声明Connection对象*/
    private Connection conn;

    public Connection getConnction() throws Exception{
        Class.forName(DRIVER);/*加载驱动*/
        conn = DriverManager.getConnection(URL,USERNAME,PASSWORD);
        return conn;
    }
    
    /*关闭数据库连接的方法*/
    public void close(){
        if(conn != null){
            try{
                this.conn.close();
            }catch (SQLException e){
                e.printStackTrace();
            }
        }
    }
}

3.2 User实体类-JavaBean

User特征

有一个默认的无参构造函数
需要被序列化即实现Serializable接口
除userid属性只读外（本案例中userid由数据库自动生成）其余属性均可读写
所有属性均有getter和setter方法

User代码

package cn.lot.VO;

import java.io.Serializable;

public class User implements Serializable {
    private int userid;
    private String username;
    private String address;
    private String password;
    private String sex;
    private String email;

    public User() {}

    public User(int userid, String username, String address, String password, String sex, String email) {
        this.userid = userid;
        this.username = username;
        this.password = password;
        this.address = address;
        this.sex = sex;
        this.email = email;
    }

    public int getUserid() {
        return userid;
    }
    
    public void setUserid(int userid) {
        this.userid = userid;
    }

    public String getUsername() {
        return username;
    }

    public void setUsername(String username) {
        this.username = username;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }

    public String getAddress() {
        return address;
    }

    public void setAddress(String address) {
        this.address = address;
    }

    public String getSex() {
        return sex;
    }

    public void setSex(String sex) {
        this.sex = sex;
    }

    public String getEmail() {
        return email;
    }

    public void setEmail(String email) {
        this.email = email;
    }

    @Override
    public String toString() {
        return "User{" +
                "userid=" + userid +
                ", username='" + username + '\'' +
                ", address='" + address + '\'' +
                ", password='" + password + '\'' +
                ", sex='"

最低0.47元/天解锁文章

yQuani

关注

2
点赞
踩
18

收藏

觉得还不错? 一键收藏
5
评论
JSP+Servlet+JavaBean+DAO模式+JDBC+Bootstrap+ajax+自定义标签完成用户登录验证

文章目录一.案例要求二.使用工具工具相关文件的导入三.案例导图四.案例实现1.数据库建立1.1 新建数据库1.2 建表1.3 添加记录2.登录页面实现Bootstrap部署login.jsp实现效果3.JDBC的DAO模式实现3.1 数据库连接类3.2 User实体类-JavaBeanUser特征User代码3.3 UserDAO接口类3.4 UserDAOImpl实现类3.5 UserDAOPr...
复制链接

扫一扫