2021_01_08_实习实训_day04_员工后台管理项目_登录页面实现

项目empManeger_2021

项目资源树

后台:
在这里插入图片描述

前台:
在这里插入图片描述

登录页面login.jsp实现

<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2021/1/8
  Time: 14:28
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户登录</title>

    <style>
        body{
            background-image: url("images/bg.jpg");
            background-repeat: no-repeat;
            background-size: 100% 100%;
            background-attachment: fixed;
        }
    </style>

</head>
<body>
<div align="center">
    <h3>员工管理后台</h3>
    <form action="LoginServlet" method="post">
        <table>
            <tr>
                <td align="right">用户名:</td>
                <td><input type="text" name="uname"></td>
            </tr>
            <tr>
                <td align="right">密码:</td>
                <td><input type="password" name="pwd"></td>
            </tr>
            <tr>
                <td colspan="2" align="center">
                    <input type="submit" value="登录">
                </td>
            </tr>
        </table>
    </form>
</div>

<!--展示错误信息-->
<%--jsp可以获取到后台服务器传递回来的值--%>
<div align="center" style="color:red;">
    ${msg}
</div>
<input id="msgLogin" type="hidden" value="${msgLogin}">
<script>
    window.onload=function () {
        var msgLogin=document.getElementById("msgLogin").value;
        //展示提示信息
        if (msgLogin != "" && msgLogin != null){
            alert(msgLogin);}
    }
</script>
</body>
</html>

实体模型MyUser

根据java面向对象的思想,需要创建一个用户对象,需要通过用户类创建出来,所以我们在src下新建一个model包,用于存储实体类

package com.wangbiao.emp.model;

/**
 * @ClassName MyUser
 * @Description TODO
 * @Author wangbiao
 * @Date 2021/1/8
 * @Version 1.0
 */
 
//大驼峰命名法
public class MyUser {
//声明我们关注的信息
    private int id;
    private String uname;
    private String password;

	//方法getter和setter,方便获取实体模型的信息
    public int getId() {
        return id;
    }

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

    public String getUname() {
        return uname;
    }

    public void setUname(String uname) {
        this.uname = uname;
    }

    public String getPassword() {
        return password;
    }

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

数据库连接类DBUtil

package com.wangbiao.emp.util;

import java.sql.*;

/**
 * @ClassName DBUtil
 * @Description TODO
 * @Author wangbiao
 * @Date 2021/1/7
 * @Version 1.0
 */
public class DBUitl {

    /**
     * JDBC:是java制定的java连接数据库的标准格式
     * 各个数据库不同的地方由数据库自己制定,然后将功能类封装为一个jar包
     * 这个jar包中就是具体连接数据库的方式,这个jar包我们称之为数据库驱动包
     * 数据库连接类所依赖的jar包在JDK中没有提供,
     * 所以需要手动添加到程序的项目结构模块的dependencies中
     * 本实例添加的是MySQL官方所提供的数据库驱动包,其
     */

    //连接数据库的四大参数
    //驱动字符串
    private static String driver = "com.mysql.jdbc.Driver";
    //连接字符串
    private static String url = "jdbc:mysql://localhost:3306/mysql";
    //用户名,这里填写连接数据库的用户名
    private static String uname = "root";
    //密码,这里填写连接数据库的用户密码
    private static String pwd = " "; 


    /**
     * 连接数据库并返回一个连接对象
     * @return
     */
    public static Connection getConn(){
        //加载驱动
        try {
            Class.forName(driver);
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        }

        //获取连接对象
        Connection conn = null;

        try {
            conn = DriverManager.getConnection(url,uname,pwd);
        } catch (SQLException e) {
            e.printStackTrace();
        }
        //将conn对象返回出去
        return conn;
    }

    /**
     * 关闭数据库操作时所用到的资源
     */
    public static void closeAll(Connection conn, PreparedStatement pst, ResultSet rs){
        try{
            if(rs != null){
                rs.close();
            }
            if(pst != null){
                pst.close();
            }
            if (conn != null){
                conn.close();
            }
        }catch(SQLException e){
            e.printStackTrace();
        }

    }

}

数据库接口与方法

数据库接口类IMyUserDao

package com.wangbiao.emp.dao;

import com.wangbiao.emp.model.MyUser;

/**
 * interface代表接口
 * 接口用于设计这个项目所具备的功能
 * dao:data access object 数据 存取 对象
 * dao的作用就是将数据库中的数据和程序中的对象进行转换
 */
public interface IMyUserDao {

    /**
     * 抽象方法,没有具体的实现,只代表当前系统具有这个功能
     * @return 返回值,指的是这个方法的运行结果应该是一个用户对象
     */
    MyUser selectByNameAndPwd(String name,String pwd);

}

数据库接口方法实现类MyUserDaoImpl

package com.wangbiao.emp.dao.impl;

import com.wangbiao.emp.dao.IMyUserDao;
import com.wangbiao.emp.model.MyUser;
import com.wangbiao.emp.util.DBUitl;

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

/**
 * @ClassName MyUserDaoImpl
 * @Description TODO
 * @Author wangbiao
 * @Date 2021/1/7
 * @Version 1.0
 */
public class MyUserDaoImpl implements IMyUserDao {

    /**
     * 方法的重写:就是去实现接口中的方法
     * 我们要在方法实现查询功能:连接数据库,执行sql,拿到运行结果
     * @return
     */
    @Override
    public MyUser selectByNameAndPwd(String name,String pwd) {
        //连接数据库
        Connection conn = DBUitl.getConn();
        MyUser myUser = null;
        PreparedStatement pst = null;
        ResultSet rs = null;
        try{
            String sql = "select * from myuser where uname = ? and password = ?";
            //用于执行sql语句
            pst = conn.prepareStatement(sql);
            //将?设置为具体的值,1和2代表的下标
            pst.setString(1,name);
            pst.setString(2,pwd);
            //执行sql,rs代表查询结果
            rs = pst.executeQuery();

            //判断rs中是否用结果
            if(rs.next()){
                myUser = new MyUser();
                //将数据转换为对象
                myUser.setId(rs.getInt("id"));
                myUser.setUname(rs.getString("uname"));
                myUser.setPassword(rs.getString("password"));
            }
        }catch(SQLException e){
            e.printStackTrace();
        }finally {
            DBUitl.closeAll(conn,pst,rs);
        }

        return myUser;
    }
}

业务逻辑接口与方法

业务逻辑接口类IMyUserService

package com.wangbiao.emp.service;

import com.wangbiao.emp.model.MyUser;

/**
 * 业务逻辑层接口
 * 声明当前项目所具有的逻辑功能
 */
public interface IMyUserService {

    MyUser login(String name,String pwd);

}

业务逻辑接口方法实现类MyUserServiceImpl

package com.wangbiao.emp.service.impl;

import com.wangbiao.emp.dao.IMyUserDao;
import com.wangbiao.emp.dao.impl.MyUserDaoImpl;
import com.wangbiao.emp.model.MyUser;
import com.wangbiao.emp.service.IMyUserService;

/**
 * @ClassName IMyUserServiceImpl
 * @Description TODO
 * @Author wangbiao
 * @Date 2021/1/8
 * @Version 1.0
 */
public class MyUserServiceImpl implements IMyUserService {
    //创建dao层对象
    private IMyUserDao myUserDao = new MyUserDaoImpl();

    /**
     * 登录的本质其实就是查询数据库,这个功能已经由Dao层实现了
     * 我们在方法中只需使用dao层提供的功能,并拿到dao层的运行结果即可
     * @param name
     * @param pwd
     * @return
     */
    @Override
    public MyUser login(String name, String pwd) {
        //接收dao层的运行结果
        MyUser myUser = myUserDao.selectByNameAndPwd(name,pwd);
        //并将运行结果继续返回给上一层的servlet
        return myUser;
    }
}

LoginServlet

package com.wangbiao.emp.servlet;

import com.wangbiao.emp.model.MyUser;
import com.wangbiao.emp.service.IMyUserService;
import com.wangbiao.emp.service.impl.MyUserServiceImpl;

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

@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //获取用户信息
        String uname = request.getParameter("uname"); //小括号中的内容和前台input的name属性值完全对应
        String pwd = request.getParameter("pwd");

        //调用service层的方法,实现登录功能
        IMyUserService myUserService = new MyUserServiceImpl();
        MyUser myUser = myUserService.login(uname,pwd);

        if(myUser != null){
            //用户名和密码输入正确
            //通知浏览器跳转到一个新页面
            //登录成功后,我们先去数据库中查询全部的员工信息
            //然后将员工信息响应给浏览器


            //用session对象存储用户名,这样在每个页面都可以访问用户名信息
            HttpSession session = request.getSession();
            session.setAttribute("uname",uname);

            //重定向的跳转方式
            response.sendRedirect("GetAllEmpServlet");

            //转发
           /* request.setAttribute("uname",uname);
            request.getRequestDispatcher("GetAllEmpServlet").forward(request,response);*/


        }else{
            //转发

            //用户名密码错误
            //在浏览器中给出错误提示
            request.setAttribute("msg","用户名或者密码错误");
            //页面跳转回登录页面,并且将提示信息响应回去
            request.getRequestDispatcher("login.jsp").forward(request,response);

        }

    }
}

默认打开登录界面

可以在web.xml中设置,再次启动Tomcat之后就会直接访问登录页面了

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    <welcome-file-list>
        <!--默认访问首页-->
        <welcome-file>login.jsp</welcome-file>
    </welcome-file-list>

</web-app>
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值