准备工作
所使用到的技术:
前端–html css javascript
后端–tomcat servlet jsp el jdbc mybatis
项目结构:
实现原理:
1.登录页面的逻辑结构
2.数据库设计
登录页面
login.jsp
<%--
Created by IntelliJ IDEA.
User: thorns
Date:2021/12/14
Time:10:08
To change this template use File | Settings | File Templates.--%><%@ page contentType="text/html;charset=UTF-8" isELIgnored="false" language="java"%><html><head><title>登录页面</title><style>
#frame_{
width:500px;
height:400px;
margin-left:600px;
margin-top:210px;
background-color: azure;
border:black solid 2px;}
#inner_{
margin-left:180px;
margin-top:140px;}</style><%-->
在这里写js代码,对那些数据进行验证:
用户id是否为空
先去拿标签里面的值 判断是否为空
为空的时候 就返回 并且来一个提示操作 用户id不能为空
密码是否为空
先去拿标签里面的值 判断是否为空
为空的时候 就返回 并且来一个提示操作 用户密码不能为空
<--%><script></script></head><body><div id="frame_"><div id="inner_">
用户id:<input type="text" id="u_id"><br><br>
密码:<input type="password" id="u_pwd"><br><br><button id="btn01">重置</button><button style="margin-left:20px" id="btn02">登录</button><br><span id="error" style="color: #ff0000">${error}</span><script><%-->
在这里写js代码,对那些数据进行验证:
用户id是否为空
先去拿标签里面的值 判断是否为空
为空的时候 就返回 并且来一个提示操作 用户id不能为空
密码是否为空
先去拿标签里面的值 判断是否为空
为空的时候 就返回 并且来一个提示操作 用户密码不能为空
<--%>let btn001 = document.getElementById("btn02");
btn001.onclick=function(){//1.获取id查看是否为空let id_str = document.getElementById("u_id").value;if(id_str==null||id_str==""){
document.getElementById("error").innerHTML="账户不能为空!"return;}let pwd_str=document.getElementById("u_pwd").value;if(pwd_str==null||pwd_str==""){
document.getElementById("error").innerHTML="密码不能为空!"return;}//我们开始访问服务器
window.location.href ="LoginServlet?u_id="+id_str+"&u_pwd="+pwd_str;}</script></div></div></body></html>
LoginServlet
import java.io.IOException;import java.util.ArrayList;/*
这个注解就是我们起的名字,为了让前端的页面来访问 */
@WebServlet("/LoginServlet")publicclassLoginServletextendsHttpServlet{
@Override
protectedvoidservice(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String u_id = req.getParameter("u_id");
String u_pwd = req.getParameter("u_pwd");
User u =newUser();
u.setU_id(Integer.valueOf(u_id));
u.setU_pwd(u_pwd);//实现登录服务层的业务逻辑层
loginService l =newloginServiceImpl();
User user = l.loginService(u);/*
如果user为空,说明账户和密码不一致,就跳转到到登录页面
如果不为空,账户和密码一直,就跳转到主界面
*/if(user !=null){/*获取Arr对象*/
FileService fs =newFileServiceImpl();
ArrayList<User> arr = fs.getAllStudent();
req.setAttribute("user", user);
req.setAttribute("arr",arr);
req.getRequestDispatcher("mainPage.jsp").forward(req, resp);}else{
req.setAttribute("error","账户和密码不一致");
req.getRequestDispatcher("login.jsp").forward(req, resp);}}}
bean层:User.java
package com.StudentManager.bean;publicclassUser{private int u_id;private String u_name;private String u_pwd;private String u_phone;private int role;private int isdelete;publicUser(){}publicUser(int u_id, String u_name, String u_pwd, String u_phone, int role, int isdelete){this.u_name = u_name;this.u_id = u_id;this.u_pwd = u_pwd;this.u_phone = u_phone;this.role = role;this.isdelete = isdelete;}public String getU_name(){return u_name;}publicvoidsetU_name(String u_name){this.u_name = u_name;}public int getU_id(){return u_id;}publicvoidsetU_id(int u_id){this.u_id = u_id;}public String getU_pwd(){return u_pwd;}publicvoidsetU_pwd(String u_pwd){this.u_pwd = u_pwd;}public String getU_phone(){return u_phone;}publicvoidsetU_phone(String u_phone){this.u_phone = u_phone;}public int getRole(){return role;}publicvoidsetRole(int role){this.role = role;}public int getIsdelete(){return isdelete;}publicvoidsetIsdelete(int isdelete){this.isdelete = isdelete;}
@Override
public String toString(){return"User{"+"u_id="+ u_id +", u_name='"+ u_name +'\''+", u_pwd='"+ u_pwd +'\''+", u_phone='"+ u_phone +'\''+", role="+ role +", isdelete="+ isdelete +'}';}}
service层:loginService.java
package com.StudentManager.service;import com.StudentManager.bean.User;publicinterfaceloginService{
User loginService(User u);}
service层:loginServiceImpl.java(接口)
package com.StudentManager.service;import com.StudentManager.bean.User;import com.StudentManager.dao.LoginDao;import com.StudentManager.dao.LoginDaoImpl;publicclassloginServiceImplimplementsloginService{
@Override
public User loginService(User u){
LoginDao ld =newLoginDaoImpl();return ld.logindao(u);}}
dao层:loginDao.java
package com.StudentManager.dao;import com.StudentManager.bean.User;publicinterfaceLoginDao{
User logindao(User u);}
dao层:loginDaoImpl.java(接口)
package com.StudentManager.dao;import com.StudentManager.bean.User;import com.StudentManager.util.ConnectionFactory;import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;publicclassLoginDaoImplimplementsLoginDao{
@Override
public User logindao(User u){
int id = u.getU_id();
String pwd = u.getU_pwd();//就在这里写数据库的东西//获取连接对象->准备我们的sql语句->把sql语句放在prepareStatement = ConnectionFactory.获取结果//执行
Connection connection = ConnectionFactory.getConnection();
PreparedStatement pre =null;
ResultSet res =null;//准备sql语句
String sql ="SELECT * FROM `user` WHERE u_id="+id+" AND u_pwd='"+pwd+"'";try{
pre = connection.prepareStatement(sql);
res = pre.executeQuery();/*
如果信息正确->返回一条数据
如果信息错误—>返回null
*/while(res.next()){
User user =newUser();
user.setU_id(res.getInt("u_id"));
user.setU_name(res.getString("u_name"));
user.setU_pwd(res.getString("u_pwd"));
user.setU_phone(res.getString("u_phone"));
user.setRole(res.getInt("u_isdelete"));return user;}}catch(SQLException e){
e.printStackTrace();}returnnull;}}
主界面
mainPage.jsp
<%--
Created by IntelliJ IDEA.
@author:--%><%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" isELIgnored="false"%><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%><html><head><title>主界面</title><style>
#head_{
height:100px;
width:100%;
background-color: slategray;}
#personFile{
width:120px;
height:50px;
padding-top:25px;
margin-left:90%;}
#search{
height:70px;
width:100%;
background-color: cornflowerblue;}
#inner_s{/*width: 200px;
height: 40px;
padding-right: 70%;
padding-top: 50%;*/
width:30%;
padding-top:25px;
padding-left:45%;}
#table{
margin-left:30%;
margin-top:30px;}
td{
text-align: center;
height:20px;
width:150px;
border: black 1px solid;
padding:1px;}</style><script>functionsearch(){//要搜索的信息就拿回来了let v = document.getElementById("fileId").value;/* v id 名字*/
window.location.href ="MainServlet?v="+v+"&id=${user.getU_id()}";}functiongoShow(v){
window.location.href ="ShowServlet?v="+v+"&id=${user.getU_id()}";}functiondel(v,name){let isdel =confirm("是否删除"+v+"同学");if(isdel){
window.location.href ="DeleteServlet?v="+v+"&id=${user.getU_id()}";}else{return;}}functionupDate(v){/* v:学生的id
我们先跳到服务器里 从服务器里再跳到修改界面
1.学生的id
2.老师的id*/
window.location.href ="upTo?stuId="+v+"&admId=${user.getU_id()}";}</script></head><body><div id="head_"><div id="personFile">
名字:<span style="color: red">${user.getU_name()}</span><br>
编号:<span style="color: red">${user.getU_id()}</span></div></div><div id="search"><div id="inner_s"><input type="text" style="font-size: 20px; height: 26px;width: 190px" id="fileId"><button style="font-size: 18px; height: 28px;" onclick="search()">查询</button></div></div><div><table id="table" style="height: 30px;width: 700px;border: black 1px solid;border-collapse:collapse;"><tr><td>学生id</td><td>学生名字</td><td>学生电话</td><td>查看成绩</td><td>操作</td></tr><c:forEach items="${arr}"var="item"><tr><td>${item.getU_id()}</td><td>${item.getU_name()}</td><td>${item.getU_phone()}</td><td><button style="color: chocolate" onclick="goShow(${item.getU_id()})">查看成绩</button></td><td><button style="color: chocolate" onclick="upDate(${item.getU_id()})">修改</button><button style="color: chocolate" onclick="del(${item.getU_id()})">删除</button></td></tr></c:forEach></table></div></body></html>
数据库的连接
数据库连接池–c3p0
- 导入jar包
- 配置xml文件c3p0-config.xml
<?xml version="1.0" encoding="UTF-8"?><c3p0-config><default-config><!--mysql数据库连接的各项参数--><propertyname="driverClass">com.mysql.cj.jdbc.Driver</property><propertyname="jdbcUrl">jdbc:mysql://localhost:3306/studentManager?useSSL=false&serverTimezone=Asia/Shanghai&characterEncoding=utf-8&autoReconnect=true</property><propertyname="user">root</property><propertyname="password">root</property><!--配置数据库连接池的初始连接数、最小链接数、获取连接数、最大连接数、最大空闲时间--><propertyname="acquireIncrement">10</property><propertyname="initialPoolSize">10</property><propertyname="maxPoolSize">100</property><propertyname="maxIdleTime">60</property><propertyname="minPoolSize">5</property></default-config></c3p0-config>
==创建连接:ConnectionFactory工具类抽取 ==
( 通过上面的操作,我们已经能够对数据库的数据进行增删改查了,但是我们发现,无论增删改查都需要连接数据库,关闭资源,所以我们把连接数据库,释放资源的操作抽取到一个工具类 )
package com.StudentManager.util;import com.mchange.v2.c3p0.ComboPooledDataSource;import javax.sql.DataSource;import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;publicclassConnectionFactory{//获取数据源 自动读取c3p0-config.xml文件privatestatic DataSource dataSource =newComboPooledDataSource();//获取连接publicstatic Connection getConnection(){try{return dataSource.getConnection();}catch(SQLException e){
e.printStackTrace();}returnnull;}//资源关闭工具方法publicstaticvoidclose(Connection connection,PreparedStatement preparedStatement,ResultSet resultSet){try{//释放资源,根据先开后放if(resultSet !=null) resultSet.close();if(preparedStatement !=null) preparedStatement.close();if(connection !=null) connection.close();}catch(SQLException e){
e.printStackTrace();}}}
执行SQL语句:loginDaoImpl.java(接口)
package com.StudentManager.dao;import com.StudentManager.bean.User;import com.StudentManager.util.ConnectionFactory;import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;publicclassLoginDaoImplimplementsLoginDao{
@Override
public User logindao(User u){
int id = u.getU_id();
String pwd = u.getU_pwd();//就在这里写数据库的东西//获取连接对象->准备我们的sql语句->把sql语句放在prepareStatement = ConnectionFactory.获取结果//执行/*通过管理器的静态方法getConnection建立数据库连接*/
Connection connection = ConnectionFactory.getConnection();/*执行预编译SQL语句对象*/
PreparedStatement pre =null;/*返回查询结果集接口*/
ResultSet res =null;//准备sql语句
String sql ="SELECT * FROM `user` WHERE u_id="+id+" AND u_pwd='"+pwd+"'";try{
pre = connection.prepareStatement(sql);
res = pre.executeQuery();/*
如果信息正确->返回一条数据
如果信息错误—>返回null
*/while(res.next()){/*java.sql.ResultSet接口类似于一个数据表,通过该接口的实例可以获得检索结果集以及对应的数据库表相关信息。res.next()方法是遍历数据表*/
User user =newUser();
user.setU_id(res.getInt("u_id"));
user.setU_name(res.getString("u_name"));
user.setU_pwd(res.getString("u_pwd"));
user.setU_phone(res.getString("u_phone"));
user.setRole(res.getInt("u_isdelete"));return user;}}catch(SQLException e){
e.printStackTrace();}returnnull;}}
跳转到登录界面
LoginServlet
import java.io.IOException;import java.util.ArrayList;/*
这个注解就是我们起的名字,为了让前端的页面来访问 */
@WebServlet("/LoginServlet")publicclassLoginServletextendsHttpServlet{
@Override
protectedvoidservice(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String u_id = req.getParameter("u_id");
String u_pwd = req.getParameter("u_pwd");
User u =newUser();
u.setU_id(Integer.valueOf(u_id));
u.setU_pwd(u_pwd);//实现登录服务层的业务逻辑层
loginService l =newloginServiceImpl();
User user = l.loginService(u);/*
如果user为空,说明账户和密码不一致,就跳转到到登录页面
如果不为空,账户和密码一直,就跳转到主界面
*//*if (user != null) {
FileService fs = new FileServiceImpl();
ArrayList<User> arr = fs.getAllStudent();
req.setAttribute("user", user);
req.setAttribute("arr",arr);*/
req.getRequestDispatcher("mainPage.jsp").forward(req, resp);}else{
req.setAttribute("error","账户和密码不一致");
req.getRequestDispatcher("login.jsp").forward(req, resp);}}}
动态获取
LoginServlet
if(user !=null){/*获取Arr对象*/
FileService fs =newFileServiceImpl();
ArrayList<User> arr = fs.getAllStudent();
req.setAttribute("user", user);
req.setAttribute("arr",arr);
req.getRequestDispatcher("mainPage.jsp").forward(req, resp);}else{
req.setAttribute("error","账户和密码不一致");
req.getRequestDispatcher("login.jsp").forward(req, resp);}}}
FIleService.java
package com.StudentManager.service;import com.StudentManager.bean.User;import java.util.ArrayList;publicinterfaceFileService{
ArrayList<User>getAllStudent();}
FIleServiceImpl.java
package com.StudentManager.service;import com.StudentManager.bean.User;import com.StudentManager.dao.FileDao;import com.StudentManager.dao.FileDaoImpl;import java.util.ArrayList;publicclassFileServiceImplimplementsFileService{
FileDao fs =newFileDaoImpl();
@Override
public ArrayList<User>getAllStudent(){/*访问持久层*/return fs.getAllStudent();}}}
FIleDao.java
package com.StudentManager.dao;import com.StudentManager.bean.User;import java.util.ArrayList;publicinterfaceFileDao{
ArrayList<User>getAllStudent();}
FIleDaoImpl.java
package com.StudentManager.dao;import com.StudentManager.bean.Major;import com.StudentManager.bean.User;import com.StudentManager.util.ConnectionFactory;import java.sql.Connection;import java.sql.PreparedStatement;import java.sql.ResultSet;import java.sql.SQLException;import java.util.ArrayList;publicclassFileDaoImplimplementsFileDao{
@Override
public ArrayList<User>getAllStudent(){
ArrayList<User> arr =newArrayList<>();
Connection connection = ConnectionFactory.getConnection();
PreparedStatement pre =null;
ResultSet res =null;//准备sql语句
String sql ="SELECT * FROM `user` WHERE u_role=1 AND u_isdelete=0";try{
pre = connection.prepareStatement(sql);
res = pre.executeQuery();/*
如果信息正确->返回一条数据
如果信息错误—>返回null
*/while(res.next()){
User user =newUser();
user.setU_id(res.getInt("u_id"));
user.setU_name(res.getString("u_name"));
user.setU_pwd(res.getString("u_pwd"));
user.setU_phone(res.getString("u_phone"));
user.setRole(res.getInt("u_isdelete"));
arr.add(user);}}catch(SQLException e){
e.printStackTrace();}return arr;}}
mainPage.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" isELIgnored="false"%><%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>...<c:forEach items="${arr}"var="item"><tr><td>${item.getU_id()}</td><td>${item.getU_name()}</td><td>${item.getU_phone()}</td><td><button style="color: chocolate" onclick="goShow(${item.getU_id()})">查看成绩</button></td><td><button style="color: chocolate" onclick="upDate(${item.getU_id()})">修改</button><button style="color: chocolate" onclick="del(${item.getU_id()})">删除</button></td></tr></c:forEach>
搜索功能
mainPage.jsp
...<script>functionsearch(){//要搜索的信息就拿回来了let v = document.getElementById("fileId").value;/* v id 名字*/
window.location.href ="MainServlet?v="+v+"&id=${user.getU_id()}";}</script>...<div id="search"><div id="inner_s"><input type="text" style="font-size: 20px; height: 26px;width: 190px" id="fileId"><button style="font-size: 18px; height: 28px;" onclick="search()">查询</button></div></div>
MainServlet.java
...
@WebServlet("/MainServlet")publicclassMainServletextendsHttpServlet{
@Override
protectedvoidservice(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
req.setCharacterEncoding("UTF-8");
String v = req.getParameter("v");
FileService fs =newFileServiceImpl();
User u = fs.getFileByNameOrId(v);
ArrayList<User> arr =newArrayList<>();
arr.add(u);
req.setAttribute("user",admineU);if(u!=null){
req.setAttribute("arr",arr);
req.getRequestDispatcher("mainPage.jsp").forward(req,resp);}}}
FileService.java
User getFileByNameOrId(String v);
FileServiceImpl.java
public User getFileByNameOrId(String v){return fs.getFileByNameOrId(v);}
FileDao.java
User getFileByNameOrId(String v);
FileDaoImpl.java
public User getFileByNameOrId(String v){
Connection connection = ConnectionFactory.getConnection();
PreparedStatement pre =null;
ResultSet res =null;//准备sql语句
String sql ="SELECT * FROM user WHERE u_name='"+v+"'";try{
pre = connection.prepareStatement(sql);
res = pre.executeQuery();/* 如果信息正确->返回一条数据
如果信息错误—>返回null
*/while(res.next()){
User user =newUser();
user.setU_id(res.getInt("u_id"));
user.setU_name(res.getString("u_name"));
user.setU_pwd(res.getString("u_pwd"));
user.setU_phone(res.getString("u_phone"));
user.setRole(res.getInt("u_isdelete"));return user;}}catch(SQLException e){
e.printStackTrace();}returnnull;}
保存管理员的账号":
&id=${user.getU_id()}"
MainServlet.java
String id = req.getParameter("id");
FileService fs2 =newFileServiceImpl();
User admineU = fs2.getAdmine(id);if(u!=null){...}else{
FileService f =newFileServiceImpl();
ArrayList<User> arr2 = f.getAllStudent();
req.setAttribute("arr",arr2);
req.getRequestDispatcher("mainPage.jsp").forward(req,resp);}
FileService.java
User getAdmine(String id);
FileServiceImpl.java
@Override
public User getAdmine(String id){return fs.getAdmine(id);}
FileDao.java
User getAdmine(String id);
FileDaoImpl.java
@Override
public User getAdmine(String id){
Connection connection = ConnectionFactory.getConnection();
PreparedStatement pre =null;
ResultSet res =null;//准备sql语句
String sql ="SELECT * FROM user WHERE u_id="+id;try{
pre = connection.prepareStatement(sql);
res = pre.executeQuery();/* 如果信息正确->返回一条数据
如果信息错误—>返回null
*/while(res.next()){
User user =newUser();
user.setU_id(res.getInt("u_id"));
user.setU_name(res.getString("u_name"));return user;}}catch(SQLException e){
e.printStackTrace();}returnnull;}
查看成绩,删除,修改功能可参考搜索功能
版权归原作者 二荆条3.0 所有, 如有侵权,请联系我们删除。