基于MVC架构的简单javaweb登陆注册功能实现（jsp + servlet + jdbc + mysql)

由于是第一次写博客，可能书写表达的效果不太好，希望大家见谅。此次博客主要是针对暑期老师布置的简单用户管理系统作业而展开，通过连接数据库可以利用数据库中用户信息进行登陆，并且在登陆后可修改数据库中信息（即实现数据库中的增删改查）。本次简单的用户管理系统主要分为三个部分：前端部分；后台部分；数据库部分。其中前端部分采用html+css编写，主要部分为用户登陆界面，用户注册界面和数据..

tiantianheheaa

14018人浏览 · 2018-09-14 11:18:06

tiantianheheaa · 2018-09-14 11:18:06 发布

由于是第一次写博客，可能书写表达的效果不太好，希望大家见谅。此次博客主要是针对暑期老师布置的简单用户管理系统作业而展开，通过连接数据库可以利用数据库中用户信息进行登陆，并且在登陆后可修改数据库中信息（即实现数据库中的增删改查）。

本次简单的用户管理系统主要分为三个部分：前端部分；后台部分；数据库部分。其中前端部分采用html+css编写，主要部分为用户登陆界面，用户注册界面和数据库显示界面；后台部分是以MVC为架构，将servlet作为控制逻辑，对用户发出的请求作出响应，并链接到其他视图页面进行跳转。数据库部分就是一个简单的二维表以描述用户信息，但是需要将数据库加载到后台中以实现数据库的连接。

其中用户管理系统的核心即是实现这个MVC架构，MVC架构全称为: 模版（model）、视图 (view)、控制器（controller）。对于该用户管理系统，模板主要是用户表的设计和用户业务逻辑的设计；视图作为与用户交互的页面显示，负责指引用户登陆、注册和数据库的更改；控制器负责后台中数据库的业务逻辑。整个MVC架构的工作流程如下图：

一、显示界面：

1.登陆界面：

2.注册界面：

3.登陆成功界面：

二、开发环境：

idea + tomcat8.0.53 + mysql-connector-java-5.1.37.jar + mysql

三、编写过程：

1.数据库构建

直接利用idea中的database模块构建数据库，如下图所示：

2.javaBean和userDao的设计

javaBean和UserDao作为MVC架构中的model部分，javabean主要是为了表示数据库中二维表信息，简化了之后对于数据库的操作程序。而UserDao作为数据库的控制逻辑，描述对于数据库的各类行为。具体程序如下：

javabean

package bean;

public class User {
    private int id;
    private String username;
    private String password;

    public User(){
        super();
    }

    public User(int id, String name, String password){
        this.id = id;
        this.username = name;
        this.password = password;
    }
    public int getId(){
        return id;
    }

    public void setId(int id1){
        this.id = id1;
    }

    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;
    }

}

userDao,其中引入了user的接口

package Dao;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.*;

import bean.User;
import conn.DBconn;

public class userDao implements InterfaceUser{
    @Override
    public List<User> getAllUsers(){
        List<User> list = new ArrayList<User>();
        Connection conn = DBconn.getConn();
        String sql = "select * from thing";
        try {
            PreparedStatement pst = conn.prepareStatement(sql);
            ResultSet rs = pst.executeQuery();
            while(rs.next()){
                User user = new User();
                user.setId(rs.getInt("id"));
                user.setUsername(rs.getString("name"));
                user.setPassword(rs.getString("password"));
                list.add(user);
            }
            rs.close();
            pst.close();
        } catch(SQLException e){
            e.printStackTrace();
        }
        return list;
    }

    @Override
    public User userLogin(String username, String passwords) {
        User user = null;
        PreparedStatement pst = null;
        Connection conn = DBconn.getConn();
        String sql = "select * from thing where name= ? and password= ?";
        try{
            pst = conn.prepareStatement(sql);
            pst.setString(1,username);
            pst.setString(2,passwords);
            ResultSet rs = pst.executeQuery();
            if (rs.next()){
                user = new User();
                user.setUsername(rs.getString("name"));
                user.setPassword(rs.getString("password"));
            }
            pst.close();
        }catch (SQLException e){
            e.printStackTrace();
        }
        return user;
    }
    @Override
    public boolean register(User user){
        Connection conn = DBconn.getConn();
        String sql = "insert into thing(id, name, password) values(?,?,?)";
        int i = 0;
        try{
            PreparedStatement pst = conn.prepareStatement(sql);
            pst.setInt(1, user.getId());
            pst.setString(2, user.getUsername());
            pst.setString(3, user.getPassword());
            i = pst.executeUpdate();
            pst.close();
        } catch (SQLException e){
            e.printStackTrace();
        }
        return i > 0;
    }

    @Override
    public boolean updateUser(User user){
        Connection conn = DBconn.getConn();
        String sql = "UPDATE thing SET name=?, password=? where id=?";
        int i = 0;
        try{
            PreparedStatement pst = conn.prepareStatement(sql);
            pst.setString(1, user.getUsername());
            pst.setString(2, user.getPassword());
            pst.setInt(3,user.getId());
            i = pst.executeUpdate();
            pst.close();
        } catch(SQLException e){
            e.printStackTrace();
        }
        return i > 0;
    }

    @Override
    public boolean deleteUser(User user){
        Connection conn = DBconn.getConn();
        String sql = "DELETE FROM thing where id = " + user.getId();
        int i = 0;
        try{
            PreparedStatement pst = conn.prepareStatement(sql);
            i = pst.executeUpdate();
            pst.close();
        }catch (SQLException e){
            e.printStackTrace();
        }
        return i > 0;
    }

}

3.数据库的连接

package conn;

import java.sql.*;

public class DBconn {

    public static Connection getConn(){
        String url = "jdbc:mysql://localhost:3306/lzx";
        String username = "lzx";
        String password = "lzx6842658";
        String driver_string = "com.mysql.jdbc.Driver";
        Connection conn = null;
        try {
            Class.forName(driver_string);
            conn = DriverManager.getConnection(url, username, password);
        } catch (Exception e){
            System.out.println("数据库数据异常");
            e.printStackTrace();
            }
        return conn;
    }

4.servlet业务逻辑

1）loginServlet:

在doPost函数中判定输入的账号密码是否存在与数据库中，若存在则显示登陆成功，并跳转到数据库显示界面；反之则显示登陆失败。

package Servlet;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import Dao.userDao;
import bean.User;

public class loginServlet extends HttpServlet{

    public loginServlet() {
        super();
    }

    public void destroy() {
        super.destroy();
    }

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        this.doPost(request, response);
    }


    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        request.setCharacterEncoding("UTF-8");
        String name = request.getParameter("username");
        String password = request.getParameter("password");
        userDao ud = new userDao();
        User user = ud.userLogin(name, password);
        if(user != null){
            request.getRequestDispatcher("success.jsp").forward(request, response);
        }
        else if (name.equals("admin")&&password.equals("123456")){
            request.getRequestDispatcher("success.jsp").forward(request, response);
        } else{
            response.sendRedirect("index.jsp?error=yes");
        }
    }

}

2）registerServlet:

在doPost函数中添加账号和密码，并将其加入到数据库中。

package Servlet;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import Dao.userDao;
import bean.User;


public class registerServlet extends HttpServlet {


    public registerServlet() {
        super();
    }

    public void destroy() {
        super.destroy();
    }

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        this.doPost(request, response);
    }


    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        request.setCharacterEncoding("UTF-8");    //设置请求数据的字符编码格式
        String name = request.getParameter("username"); //获得请求表单中的用户名
        String pwd = request.getParameter("password");  //获得请求表单中的密码
        User user = new User();
        user.setUsername(name);
        user.setPassword(pwd);
        userDao ud = new userDao();
        if(ud.register(user)){
            request.getRequestDispatcher("index.jsp").forward(request, response);
        }
        else {
            response.sendRedirect("index.jsp");
        }
    }

    /**
     * Initialization of the servlet. <br>
     *
     * @throws ServletException if an error occurs
     */
    public void init() throws ServletException {
        // Put your code here
    }
}

3）deleteServlet:

package Servlet;

import Dao.userDao;
import bean.User;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class deleteServlet extends HttpServlet {


    public deleteServlet() {
        super();
    }

    public void destroy() {
        super.destroy();
    }

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        this.doPost(request, response);
    }


    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        request.setCharacterEncoding("UTF-8");
        int id = Integer.parseInt(request.getParameter("id"));
        User user = new User();
        user.setId(id);
        userDao ud = new userDao();
        if(ud.deleteUser(user)){
            request.getRequestDispatcher("success.jsp").forward(request, response);
        }
        else {
            response.sendRedirect("success.jsp");
        }
    }

    /**
     * Initialization of the servlet.
     *
     * @throws ServletException if an error occurs
     */
    public void init() throws ServletException {

    }
}

5、前端界面

1.登陆界面：

<%--
  Created by IntelliJ IDEA.
  User: lzx666
  Date: 2018/8/6
  Time: 15:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>登录</title>
  <!-- Bootstrap core CSS -->
  <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
  <!-- Custom styles for this template -->
  <link rel="stylesheet" href="first.css" />
  <link rel="stylesheet" href="login.css" />
</head>
<body>
<div class="container">
  <form
          action="loginServlet"
          method="post">

    <h3>
      <a href="index.jsp">用户登陆</a>
    </h3>

    <label
            for="input"
            class="sr-only">用户名</label>

    <input
            type="text"
            id="input"
            class="form-control"
            placeholder="用户名"
            name="username"
            required>

    <label
            for="inputPassword"
            class="sr-only">密码</label>

    <input
            type="password"
            id="inputPassword"
            class="form-control"
            placeholder="密码"
            name="password"
            required>

    <button
            class="btn btn-lg btn-primary btn-block"
            type="submit"
            id="submit">登录</button>

    <a
            href="register.jsp">注册</a>
  </form>
</div>

<div id="footer">
  <a target="_blank"
     href="https://github.com/LouZhiX">
    <img src="byr.jpg"
         width="30px"
         height="20px" class="img-circle">Copyright</a>
  by lzx.
</div>
<script>
    var error ='<%=request.getParameter("error")%>';
    if(error == 'yes'){
        alert("账号或者密码错误!");
    }
</script>
</body>
</html>

css样式：

body {
    background: #eee;
}
.container {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 340px;
    height: 400px;
    margin-left: -170px;
    margin-top: -200px;
    text-align: center;
}

#input, #inputpassword {
    margin: 10px 0;
}

#submit {
    margin-top: 10px;
}

.visitor {
    display: inline-block;
    margin-top: 20px;
}
a:link {
    text-decoration: none;
}

.c_center {
    text-align: center;
}

.c_left {
    text-align: left;
}

.c_right {
    text-align: right;
}

.f_div {
    float: left;
}

.r_div {
    float: right;
}

.head_line {
    border-bottom: 1px solid #177cb0;
}

.foot_line {
    border-top: 1px solid #C0C0C0;
    margin-bottom: 20px;
}

.inline {
    display: inline;
    float: left;
    margin-left: 23px;
    margin-right: 25px;
    margin-bottom: 20px;
}

#main {
    width: 68%;
}

#content {
    text-align: center;
    clear: both;
}

#list {
    margin-top: 10px;
}

#tag {
    margin-top: 50px;
}

#footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px;
    clear: both;
    text-align: center;
}

2.注册界面：

<%--
  Created by IntelliJ IDEA.
  User: lzx666
  Date: 2018/8/14
  Time: 16:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>注册</title>
    <!-- Bootstrap core CSS -->
    <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <!-- Custom styles for this template -->
    <link rel="stylesheet" href="first.css" />
    <link rel="stylesheet" href="login.css" />
</head>
<body>
<div class="container">
    <form
            action="registerServlet"
            method="post">

        <h3>
            <a href="success.jsp">用户注册</a>
        </h3>

        <label
                for="input"
                class="sr-only">用户名</label>

        <input
                type="text"
                id="input"
                class="form-control"
                placeholder="用户名"
                name="username"
                required>

        <label
                for="inputPassword"
                class="sr-only">密码</label>

        <input
                type="password"
                id="inputPassword"
                class="form-control"
                placeholder="密码"
                name="password"
                required>
        <label
                for="inputPassword1"
                class="sr-only">确认密码</label>

        <input
                type="password"
                id="inputPassword1"
                class="form-control"
                placeholder="确认密码"
                name="password"
                required>

        <button
                class="btn btn-lg btn-primary btn-sm"
                type="submit"
        >确  认</button>

        <button
                class="btn btn-lg btn-primary btn-sm"
                type="reset"
        >取  消</button>
    </form>

</div>
</body>
</html>

3.成功登陆界面：

<%--
  Created by IntelliJ IDEA.
  User: lzx666
  Date: 2018/8/6
  Time: 16:16
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="Dao.userDao"%>
<%@ page import="bean.User"%>
<%@ page import="java.util.List" %>

<html>

<head>
    <title>数据库显示</title>
    <link rel="stylesheet" href="first.css" />
    <link rel="stylesheet" href="login.css" />
</head>
<style>
    table
    {
        width: 60%;
    }
    .data{
        color:black;
        border:2px solid RGB(73,161,225);
        border-collapse: collapse;
        font-size:17px;
    }
    .data caption{
        font-size: 22px;
        font-weight: bold;
    }
    .data td
    {
        vertical-align: middle;
        text-align: center;
    }
    .data th{
        color: cornflowerblue;
    }
    .data tr.{
        background-color: #C0C0C0;
    }
</style>
<body>
<center>
    <table class="data" border="4">
        <caption style="color: #177cb0">数据库信息</caption>
        <thead>
            <tr>
                <th>编号</th>
                <th>姓名</th>
                <th>密码</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody align="center" valign="middle">
            <%
                userDao ud = new userDao();
                List<User> users1 = ud.getAllUsers();
                for(User p: users1){
            %>
            <tr>
                <td><%=p.getId() %></td>
                <td><%=p.getUsername() %></td>
                <td><%=p.getPassword() %></td>
                <td><a href="deleteServlet?id=<%=p.getId()%>">删除</a></td>
            </tr>
        </tbody>
        <%} %>
    </table>
</center>
</body>
</html>

最后将以上所有模块连接起来，即可实现最简单的登陆注册以及数据库的删除。

一门面向 Data 和 AI 的低代码、云原生的开源编程语言

无需安装部署，在线快速体验 Byzer

更多推荐

编译时权限控制

前言权限控制，对于 MLSQL 而言的重要程度可以说是生命线。 MLSQL 需要面对各式各样的资源访问，比如 MySQL, Oracle,HDFS，Hive，Kafka，Sorl，ElasticSearch，Redis，API，Web等等，不同用户对这些数据源（以及表，列）的权限是不一样的。传统模式是，每个用户都需要有个 proxy user，然后到每个数据源里面给这个 proxy user

Byzer 白泽

Byzer 支持 JDBC 聚合下推

聚合下推PR链接聚合下推我们知道 Byzer 支持多数据源和联邦查询，可以方便分析师在一个平台上快速的分析来自多种数据源的数据，从而进行灵活的探索式分析。使用场景和优势当前 Byzer 中加载数据的方式会拉取明细数据到 spark 中进行聚合计算，对于小数据量或者在分布式文件系统上的数据源来说是常规操作。但是对于 JDBC 数据源或者有分析能力的 OLAP 系统来说拉取明细数据可能就不是最

Byzer 白泽

Byzer 术语表

Byzer-lang Byzer ，又称为 Byzer-lang，一门面向 Data 和 AI 的低代码、云原生的开源编程语言。 Byzer 是一门结合了声明式编程和命令式编程的混合编程语言，其低代码且类 SQL 的编程逻辑配合内置算法及插件的加持，能帮助数据工作者们高效打通数据链路，完成数据的清洗转换，并快速地进行机器学习相关的训练及预测。 Byzer 希望能够提供一套语言、一个引擎，就能覆盖整