MVC简单的登陆注册

时间 2019-12-11

标签 mvc 简单登陆注册繁體版

原文原文链接

MVC：模型（model）-视图（view）-控制器（Controller）javascript

1.model : 处理数据逻辑部分，对数据库进行操做，业务逻辑css

2.view : 数据显示部分，用户操做html

3.controller : 从视图层读取数据，经过模型层完成操做前端

效果图：java

该项目采用MVC模式，前端页面用到了Bootstrap及Jquerymysql

项目结构：jquery

首页index.jsp,注册页面采用的Bootstrap的模态框sql

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>登陆页面</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<link rel="stylesheet" type="text/css"
    href="./bootstrap-3.3.7-dist/css/bootstrap.css">
<script src="./jquery-3.2.1/jquery-3.2.1.min.js"></script>
<script src="./bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</head>
<style>
#re {
    margin-top: 10px;
    float: right;
}
</style>
<script type="text/javascript">
    
    function vform(){
    var name = $("#na").val();
    var password = $("#pw").val();
    if(name == ""){
        alert("请输入用户名");
        return false;
    }
    if(password == ""){
        alert("请输入密码");
        return false;
    }
        return true;
    }
</script>
<body>
    <div class="container">


        <!--模态框，点击注册按钮弹窗-->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog"
            aria-labelledby="myModalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"
                            aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                        <h4 class="modal-title" id="myModalLabel">用户注册</h4>
                    </div>
                    <div class="modal-body">
                        <form class="form-horizontal" action="Register" method="post" onsubmit="return vform()">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">账号</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" id="un"
                                        name="username" placeholder="请输入账号">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 control-label">密码</label>
                                <div class="col-sm-10">
                                    <input type="password" class="form-control" id="pw"
                                        name="password" placeholder="Password">
                                </div>
                            </div>

                            <div class="form-group">
                                <div class="col-sm-offset-2 col-sm-10">
                                    <button type="submit" class="btn btn-default">提交</button>
                                    <font color="red">${error}</font>

                                </div>
                            </div>

                        </form>

                    </div>
                    
                </div>
            </div>
        </div>
        <!-- ============================================================================= -->
        <button class="btn btn-default" id="re"
            data-toggle="modal" data-target="#myModal">注册</button>
        <center>
            <h1>用户登陆</h1>
        </center>
        <hr>
        <form class="form-horizontal" action="LoginServlet" method="post">

            <div class="form-group">
                <label class="col-sm-2 control-label">账号</label>
                <div class="col-sm-10">
                    <input type="text" class="form-control" id="username"
                        name="username" value="${username}" placeholder="请输入账号">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">密码</label>
                <div class="col-sm-10">
                    <input type="password" class="form-control" id="password"
                        name="password" value="${password}" placeholder="Password">
                </div>
            </div>

            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default">登陆</button>
                    <font color="red">${error}</font>

                </div>
            </div>
        </form>

    </div>
</body>

</html>

main.jsp数据库

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%-- <%@ page language="java" import="com.login.model.*" pageEncoding="utf-8" %> --%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>用户列表</title>
<link rel="stylesheet" type="text/css"
    href="./bootstrap-3.3.7-dist/css/bootstrap.css">
<script src="./jquery-3.2.1/jquery-3.2.1.min.js"></script>
<script src="./bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>

</head>
<style>
h4 {
    float: right;
}
</style>

<body>
    <div class="container">
        <h4>欢迎你:${currentUser.username}</h4>
        <center>
            <h1>员工信息列表</h1>
        </center>

        <div class="row">
            <div class="col-md-4 col-md-offset-8">
                <button class="btn btn-primary">新增</button>
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <table class="table table-condensed">
                    <tr>
                        <td>ID</td>
                        <td>姓名</td>
                        <td>性别</td>
                        <td>邮箱</td>
                        <td>出生年月</td>
                        <td>操做</td>
                    </tr>
                    <c:forEach var="list" items="${list}">
                        <tr>
                            <td>${list.id}</td>
                            <td>${list.name}</td>
                            <td><c:if test="${list.gender eq 0 }">男</c:if> 
                                <c:if test="${list.gender eq 1 }">女</c:if>
                            </td>
                            <td>${list.email}</td>
                            <td>${list.birthday}</td>
                            <td><button class="btn btn-primary">编辑</button>
                                <button class="btn btn-danger">删除</button>
                            </td>
                        </tr>
                    </c:forEach>
                </table>
            </div>
        </div>
    </div>
</body>
</html>

数据库链接代码：DbUtil.javabootstrap

package com.login.util;

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

public class DbUtil {
        private String url="jdbc:mysql://localhost:3306/ssm";
        private String driver="com.mysql.jdbc.Driver";
        private String user="root";
        private String password="123";
        
        public Connection getCon() throws Exception{
            Class.forName(driver);
            Connection con=DriverManager.getConnection(url,user,password);
            return con;
        }
        public static void getClose(Connection con) throws SQLException{
            if(con!=null){
                con.close();
            }
        }
}

实体类：User.java

package com.login.model;

public class User {
        private int id;
        private String username;
        private String password;
        
        public User() {
            super();
        }
        public User(String username, String password) {
            super();
            this.username = username;
            this.password = password;
        }
        public int getId() {
            return id;
        }
        public void setId(int id) {
            this.id = id;
        }
        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;
        }
        
}

Employee.java

package com.login.model;

import java.util.Date;

public class Employee {
        private int id;
        private String name;
        private String password;
        private int gender;
        private String email;
        private Date birthday;
        
        
        
        public Employee() {
            super();
        }
        public Employee(int id, String name, String password, int gender,
                String email, Date birthday) {
            super();
            this.id = id;
            this.name = name;
            this.password = password;
            this.gender = gender;
            this.email = email;
            this.birthday = birthday;
        }
        public int getId() {
            return id;
        }
        public void setId(int id) {
            this.id = id;
        }
        public String getName() {
            return name;
        }
        public void setName(String name) {
            this.name = name;
        }
        public String getPassword() {
            return password;
        }
        public void setPassword(String password) {
            this.password = password;
        }
        public int getGender() {
            return gender;
        }
        public void setGender(int gender) {
            this.gender = gender;
        }
        public String getEmail() {
            return email;
        }
        public void setEmail(String email) {
            this.email = email;
        }
        public Date getBirthday() {
            return birthday;
        }
        public void setBirthday(Date birthday) {
            this.birthday = birthday;
        }
        
        
}

UserDao.java

package com.login.dao;

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

import com.login.model.User;

public class UserDao {

    // 登陆
    public User login(Connection con, User user) throws SQLException {
        User resultUser = null;
        String sql = "select * from user where username=? and password=?";
        PreparedStatement ps = con.prepareStatement(sql);
        ps.setString(1, user.getUsername());
        ps.setString(2, user.getPassword());
        ResultSet rs = ps.executeQuery();
        if (rs.next()) {
            resultUser = new User();
            resultUser.setUsername(rs.getString("username"));
            resultUser.setPassword(rs.getString("password"));
        }
        return resultUser;
    }
// 显示全部信息
    public User getAll(Connection con, User user) throws SQLException {
        User resultUser = null;
        String sql = "select * from user ";
        PreparedStatement ps = con.prepareStatement(sql);
        ResultSet rs = ps.executeQuery();
        if (rs.next()) {
            resultUser = new User();
        }
        return resultUser;
    }

    // 注册
    public boolean insert(Connection con, User user) {
        String sql = "insert into user(username,password) values(?,?)";
        boolean flag = false;
        try {
            PreparedStatement psta = con.prepareStatement(sql);//
            psta.setString(1, user.getUsername());
            psta.setString(2, user.getPassword());
            flag = psta.executeUpdate() > 0;
        } catch (Exception e) {
            e.printStackTrace();
        }
        try {
            con.close();
        } catch (SQLException e) {

            e.printStackTrace();
        }
        return flag;
    }
}

LoginServlet.java

package com.login.servlet;

import java.io.IOException;

import java.sql.Connection;

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

import com.login.dao.UserDao;
import com.login.model.User;
import com.login.util.DbUtil;

public class LoginServlet extends HttpServlet {
    /**
     * 
     */
    private static final long serialVersionUID = 1063251913450385726L;
    DbUtil db = new DbUtil();
    UserDao userDao = new UserDao();

    public LoginServlet() {
        super();
    }

    public void destroy() {
        super.destroy(); // Just puts "destroy" string in log
        // Put your code here
    }

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        this.doPost(request, response);
    }

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

        String username = request.getParameter("username");
        String password = request.getParameter("password");
        Connection con = null;
        try {
            User user = new User(username,password);
            con = db.getCon();
            User currentUser=userDao.login(con, user);
            if(currentUser == null){
                request.setAttribute("error", "用户名或密码错误");
                request.setAttribute("username", username);
                request.setAttribute("password", password);
                request.getRequestDispatcher("index.jsp").forward(request, response);
            }else{
                    //使用request对象的getSession()获取session，若是session不存在则建立一个
                    HttpSession session = request.getSession();
                     //将数据存储到session中
                     session.setAttribute("currentUser",currentUser);
                     ArrayList<Employee> list = userDao.selectNotDeleteList();
          　　　　　　  if (list != null) {
             　　　　   HttpSession session1 = request.getSession();
              　　　　　　  // 将数据存储到session中
              　　　　  session1.setAttribute("list", list);
               　　　　 response.sendRedirect("main.jsp");
            }
                }
                
            }
         catch (Exception e) {

            e.printStackTrace();
        }

    }

    
    public void init() throws ServletException {

    }

}

package com.login.servlet;

import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;

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

import com.login.dao.UserDao;
import com.login.model.User;
import com.login.util.DbUtil;

public class Register extends HttpServlet {

    private static final long serialVersionUID = -6373590750212315505L;
     DbUtil db=new DbUtil();
     UserDao userDao=new UserDao();
    public Register() {
        super();
    }

    public void destroy() {
        super.destroy(); // Just puts "destroy" string in log
        // Put your code here
    }

    
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
            String username=request.getParameter("username");
            String password=request.getParameter("password");
            Connection con=null;
            
            User user=new User(username,password);
            try{
                con=db.getCon();
                
            }catch(Exception e){
                e.printStackTrace();
            }
            boolean current=userDao.insert(con, user);
            if(current){
                request.setAttribute("error", "注册成功,请登陆");
                request.getRequestDispatcher("index.jsp").forward(request, response);
            }else{
                request.setAttribute("error", "注册失败");
                request.getRequestDispatcher("regist.jsp").forward(request, response);
            }
        
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
            this.doGet(request, response);
    }

    public void init() throws ServletException {
        // Put your code here
    }

}

小总结：前一个多月都花时间在SSM上面了，对于Servlet和Jsp的基础不怎么样，因此如今仍是开始把基础打好，再去研究其余框架。