夏季小学期Day06,07,08——图书馆管理系统（JAVAEE，数据库mysql，前端H5）

最新推荐文章于 2024-05-27 11:34:26 发布
最新推荐文章于 2024-05-27 11:34:26 发布
阅读量3k 收藏 15
点赞数 4
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39557517/article/details/82153798
版权

写在前面：这个项目的后端是完整的，前端是把别人的项目拿过来自己覆盖了原项目的login.js。
所以大家可以以本文参考用户登陆注册后端和前后端连接的部分。

由于我的项目是直接import老师的，所以如果你也是用的别人的项目，要先右击项目，点Build Path->Configure Build Path->Build Path->Libraries->Add External JARs…->加入servlet-api.jar
这里写图片描述

由于要用mysql数据库，所以首先导入mysql-connector-java-5.1.42-bin.jar包，直接复制粘贴到lib下即可
这里写图片描述
先说一下项目结构：创建四个包，五个class，如下图所示。
Eclipse是按字典序排列的class，所以按照代码的阅读顺序是:第五个->第一个->第二个->第三个->第四个

下面分别看每个class，话不多说，代码中都有注释。
第一个：
这里写图片描述

package com.qianfeng.work.dao;

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

import com.qianfeng.work.utils.DButils;

public class UserDao {

    public String selectUser(String name){
        //调用工具类，获取工具类的对象
        DButils dbutils = DButils.getInstance();
        //连接数据库
        Connection conn=dbutils.getConn();
        PreparedStatement pst=null;
        ResultSet result=null;
        if(conn!=null){
            String sql ="select * from users where username =?";
            try {
                pst= conn.prepareStatement(sql);
                //设置占位符代表的内容，第一个参数是占位符的序号，
                //第二个参数是占位符具体的内容
                pst.setString(1, name);
                //执行查询，返回结果集
                result=pst.executeQuery();
                if(result!=null&&result.next()){
                    return result.getString("password");
                }else{
                    return "null";
                }
            } catch (SQLException e) {
                e.printStackTrace();
            }finally{
                try {
                    result.close();
                    pst.close();
                    conn.close();
                } catch (SQLException e) {
                    // TODO Auto-generated catch block
                    e.printStackTrace();
                }
            }
            return "error";
        }else{
            return "error";
        }
    }
    public int insertUser(String name, String pass) {
        //调用工具类，获取工具类的对象
                DButils dbutils = DButils.getInstance();
                //连接数据库
                Connection conn=dbutils.getConn();
                PreparedStatement pst=null;
                if(conn!=null){
                    String sql ="insert into users values(?,?)";
                    try {
                        pst= conn.prepareStatement(sql);
                        //设置占位符代表的内容，第一个参数是占位符的序号，
                        //第二个参数是占位符具体的内容
                        pst.setString(1, name);
                        pst.setString(2, pass);
                        //执行查询，返回结果集
                        return pst.executeUpdate();//返回0代表成功
                    }catch(Exception e) {
                        return 01;
                    }
                }
                else
                    return 02;


    }
}

第二个：
这里写图片描述

package com.qianfeng.work.service;

import com.qianfeng.work.dao.UserDao;

public class UserService {

    public int  loginResult(String name,String pass){
        if(name==null||pass==null){
            //如果用户名或者密码传递过来的为空，则返回1
            return 1;
        }else{
            //没有问题，那么就去查询
            UserDao dao =new UserDao();
            String result = dao.selectUser(name);
            if (result.equals("error")){
                //2代表数据库异常
                return 2;
            }else if(result.equals("null")){
                //用户名不存在
                return 3;
            }else{
                if(result.equals(pass)){
                    return 0;//代表登录成功
                }else{
                    return 4;//代表密码错误
                }
            }
        }
    }
    public int regRes(String name, String pass1, String pass2) {
        if (name==null||pass1==null||pass2==null)
            //如果用户名或者密码传递过来的为空，则返回1
            return 1;
        else {
            if(pass1.equals(pass2)) {

                return 0;//返回0代表注册成功
            }
            else
                return 2;//返回2代表两次密码输入不一致
        }
    }
}

第三个
这里写图片描述

package com.qianfeng.work.servlet;

import java.io.IOException;
import java.io.PrintWriter;

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

import com.qianfeng.work.service.UserService;

public class LoginServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
//      设置请求和响应的编码格式
            req.setCharacterEncoding("utf-8");
            resp.setContentType("text/html;charset=utf-8");
//          接收请求字段的值
            String name= req.getParameter("username");
            String pass= req.getParameter("password");
            UserService service = new UserService();
            int code= service.loginResult(name, pass);
            System.out.println(code); 
            PrintWriter ps = resp.getWriter();
            //向前端响应结果
            ps.write(code+"");
            ps.close();
    }
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp)
            throws ServletException, IOException {
        this.doPost(req, resp);    
    }

}

第四个：
这里写图片描述

package com.qianfeng.work.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 com.qianfeng.work.service.UserService;

public class RegisterServlet extends HttpServlet{
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//      设置请求和响应的编码格式
        req.setCharacterEncoding("utf-8");
        resp.setContentType("text/html;charset=utf-8");
//      接收请求字段的值
        String name= req.getParameter("username");
        String pass1= req.getParameter("password1");
        String pass2= req.getParameter("password2");
        UserService service = new UserService();
        int code= service.regRes(name, pass1, pass2);
        System.out.println(code); 
}
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp)
        throws ServletException, IOException {
        this.doPost(req, resp);    
    }

}

第五个：
1.先写工具类，三个静态常量，第一个数据库名字，第二个数据库密码，第三个url 里面内容背过就好，用的时候现查也行。

2.然后写构造方法，forname中的字符串到Libraries->Web App Libraries->mysql-connector-java….->com.mysql.jdbc下右击Driver.class文件，有个copy qualified name,然后直接粘贴过来就好。

3.因为构造方法是私有的，所以要写一个暴露方法——getInstance。
这里写图片描述

package com.qianfeng.work.utils;

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

public class DButils {
    private final static String MYSQLNAME="root";
    private final static String MYSQLPASS="123456";
    private final static String URL="jdbc:mysql://localhost:3306/book?characterEncoding=utf-8";

    private static DButils dbutils;
    private DButils(){
        try {
            //加载驱动
            Class.forName("com.mysql.jdbc.Driver");
            System.out.println("驱动加载成功");
        } catch (ClassNotFoundException e) {
            System.out.println("驱动找不到");
            e.printStackTrace();
        }
    }

    public static DButils getInstance(){
        if(dbutils==null){
            dbutils=new DButils();
        }
        return  dbutils;
    }
    /*
     * 单例模式(懒汉模式)：
     * 私有构造方法
     * 声明一个没有实例化的对象（饿汉模式是直接实例化对象）
     * 暴露方法，在暴露方法中实例化对象
     * 特点：应该来说只有一个对象
     * 
     */
    public Connection getConn(){
        try {
            Connection conn=DriverManager.getConnection(URL, MYSQLNAME, MYSQLPASS);
            return conn;
        } catch (SQLException e) {
            e.printStackTrace();
            System.out.println("数据库连接失败");
        }
        return null;
    }
}

接下来写前端，首先导入一个现成的登录界面，然后自己改改js文件
这里写图片描述

//当js文件是在html的head标签中引入，需要提供入口方法
window.onload=function(){
    //根据id获取我们需要的标签
    var input_user=document.getElementById("username");
    var input_pass=document.getElementById("password");
    var btn_login=document.getElementById("login");
    btn_login.onclick=function(){
        var name = input_user.value;
        var pass = input_pass.value;
        sendData(name, pass);
    }
    var xmlhttp;
    function sendData(name, pass) {
        //获取网络连接对象
        xmlhttp = new XMLHttpRequest();
        //设置请求方式，请求路径， 是否异步
        xmlhttp.open("POST", "http://localhost:8080/Demo01/login", true);
        //设置请求头
        xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        //发送字段
        xmlhttp.send("username="+name+"&password="+pass);
        //状态变化之后去执行=后面的方法
        xmlhttp.onreadystatechange=getResponse;
    }
    function getResponse(){
        //4代表连接成功，可以响应；0123分别代表什么
        if (xmlhttp.readyState == 4){
            if (xmlhttp.status==200)
                var code = xmlhttp.responseText;
            if (code == "0"){
                alert(" Login Successful");
            }else if (code == "2") {
                alert(" NET CONNECT ERROR");    
            }else {
                alert("username or password is not correct");
            }
        }
    }
}

写完后修改jsp文件：第八行，script标签中src中把原来的login.js改为刚刚自己写的mylogin.js
这里写图片描述

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html> 
<html>
    <head>
        <meta charset="UTF-8">
        <title>图书管理系统</title>
        <link rel="stylesheet" href="${pageContext.request.contextPath}/css/login.css" />
        <script type="text/javascript" src="${pageContext.request.contextPath}/js/mylogin.js" ></script>
    </head>
    <body>
        <div class="content">
            <div class="main">
                <div class="login">
                    <input id="username" type="text" placeholder="请您输入管理员名称"/>
                    <input id="password" type="password" placeholder="请您输入密码"/>
                    <input id="login" type="button" value="登录"/>
                    <input id="reset"   type="button" value="重置"/>
                </div>
            </div>
            <p class="foot">http://www.qfedu.com----北京市千锋互联科技有限公司</p>
        </div>
    </body>
</html>

启动service，打开一个浏览器，在地址栏输入——localhost:8080/Demo01/jsp/login.jsp
运行效果图：
这里写图片描述
这里写图片描述

更新：
今天开始做主页面，

快活书生
关注
  • 4
    点赞
  • 踩
  • 15
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
基于javaweb、mysql的 学生信息管理系统
11-24
【标题】"基于javaweb、mysql的 学生信息管理系统"揭示了这是一个使用JavaWeb技术和MySQL数据库构建的教育管理软件。JavaWeb是Java技术在Web应用中的运用，包括Servlet、JSP（JavaServer Pages）和JavaBean等组件，...
JavaEE图书管理系统（实训作业）
06-16
JavaEE开发的图书管理系统，美工界面做的很酷，适合新手学习使用，JAVAEE期末实训作业。
前、后端分离的图书管理系统
Unique0309的博客
03-03 1452
定义Java实体类（pojo），与数据库表结构相对应。如果导入了Lombok依赖，我们这里可以通过注解简化getter和setter的编写。
基于javaweb简单图书管理系统(jsp+servlet+jdbc)
qq_43485489的博客
08-10 8297
基于javaweb简单图书管理系统(jsp+servlet+jdbc)，采用eclipse开发工具，结合前端layui+jquery+css，使用jsp+ssm技术进行编写，数据库采用了mysql，navicat作为管理工具。感兴趣的同学可以交流交流！！！！
javaSE—图书管理系统（基础代码版）
最新发布
2302_80521088的博客
05-27 1547
图书管理系统演示。
一个简单的Java EE程序 图书管理系统（二）
weixin_54014691的博客
03-30 1977
采用JSP+Servlet+JavaBean的传统方式开发一个比较简单的Java EE程序
图书管理系统2.0——mysql数据库
m0_52889702的博客
10-10 9062
图书管理系统mysql数据库 jdbc swing 登录注册用户菜单 借阅图书归还图书个人中心查看所有借阅记录查看借阅中的图书 签到领积分我的消息 修改密码退出登录续借图书 评价图书 消息广场管理员菜单 管理图书添加书籍修改图书下架书籍 消息广场查看图书数据按照库存从少到多查询按照评分从高到低查询
MYSQL课程设计——图书管理系统（一）
m0_57775122的博客
07-03 1万+
图书借阅管理是学校工作中的一项重要内容，学校图书馆，书目繁多，用户的信息冗杂，且信息数据在每天变化，如果采用人工方式进行管理控制，不仅工作量庞大，而且容易出错。浪费了许多的人力和物力，已不能适应时代的发展。在当今信息时代，这种传统的管理方法必然被以计算机为基础的信息管理系统所代替，图书管理系统可以有效的管理图书资源，控制图书增加，删除，修改，学生借阅和返还的流程，缩小开支，提高工作效率与准确率，能够节省时间，既方便了管理人员，又方便了学生，对图书馆的管理有很大的帮助，极大地提高了效率。...
前后端分离项目图书管理系统
星辰里的月光
10-30 2789
这个系统嘛老师要求的较多，不过全写完的话必定受益匪浅，我暂时还没有写完，只写了其中的一部分功能，后续更新！ 大家请看：结构 功能实现需要引入两个jar包：sqljdbc4.jar,fastjson-1.2.62.jar 前端结构图： 后端结构图： 1.注册登录是需要进行验证正则表达式； 2.注册：把注册信息存入数据库用户信息表 3.登录：需要和数据库用户信息表数据比较 效果图： 代码后续更新，...
基于javaEE+Mysql实现的超市积分管理系统(源码+数据库sql+论文+视频齐全)
05-09
【作品名称】：基于javaEE+Mysql实现的超市积分管理系统(源码+数据库sql+论文+视频齐全) 【适用人群】：适用于希望学习不同技术领域的小白或进阶学习者。可作为毕设项目、课程设计、大作业、工程实训或初期项目立项...
基于javaweb的图书管理系统源码+数据库，前端由HTML/CSS/JavaScript编写，后端由javaEE编写
01-17
一个基于javaweb的图书管理系统，前端由HTML/CSS/JavaScript编写，后端由javaEE编写 软件架构说明 1.前端页面基于HTML、CSS、JavaScript构建，使用了boostrap4、Vue2.x、jquery库/框架 2.后端基于HttpServlet构建 ...
JavaEE-图书管理系统.zip
08-19
【JavaEE-图书管理系统】是一个基于Java企业版（Java Enterprise Edition，简称JavaEE）技术实现的项目，旨在提供一个高效、便捷的图书管理解决方案。在这个系统中，用户可以进行图书的借阅、归还、查询等操作，管理...
基于Java EE的图书馆管理系统
05-28
基于Java EE的图书馆管理系统 的设计与实现 ，经测试，系统完美运行。。。
图书管理系统前端代码设计
04-16
可以直接用的图书管理系统前端代码，不用麻烦的进行前端的设计，您只需编写后台即可
图书管理系统前端代码
08-14
图书馆里系统前端代码，里面包含很多图书的操作模块，希望对你有用
基于javaweb的图书管理系统毕业设计源码+数据库，前端由HTML/CSS/JavaScript编写，后端由javaEE编写
04-27
一个基于javaweb的图书管理系统，前端由HTML/CSS/JavaScript编写，后端由javaEE编写 软件架构 软件架构说明 1.前端页面基于HTML、CSS、JavaScript构建，使用了boostrap4、Vue2.x、jquery库/框架 2.后端基于...
使用JavaEE开发的一个内部图书管理系统（1）
常绍新的专栏
04-14 1万+
首先说明几点： 1、  这不是一个教程，而是我自己学习的一个过程的记录，所以过程中会有反复、甚至错误。 2、  开发过程计划采用敏捷方法的逐步求精方式进行。关于求精的过程的初步想法是： a)        先使用jsp实现功能 b)        把前端和后台功能分离，前端使用struts实现 c)        把和数据库的交互部分剥离出来，使用hibernate实现 d)
基于MySQL的图书管理系统
热门推荐
qq_40265501的博客
05-31 3万+
连接MySQL数据库1.在eclipse中新建一个java项目，然后新建一个文件夹-libs(用来存放各种外部包)[假装这里有一张操作图片]2.在包里加入连接mysql数据库的包下载链接提取密码：cn9f解压后打开"mysql-connector-java-5.0.8-bin.jar"，然后复制粘贴到我们的java项目的libs文件下面3.构建路径上的jar包打开eclipse→选择Project...
Django图书管理系统(前端对数据库的增删改查)
weixin_34279061的博客
06-13 2843
图书管理系统 出版社的管理 源码位置：https://gitee.com/machangwei-8/learning_materials/tree/master/%E9%A1%B9%E7%9B%AE/bookmanager 1.设计URL urlpatterns = [ 　　url(r'^publisher_list/', views.publisher_list), ...
基于JavaEE JSP语言 MySQL数据库的企业员工信息管理系统的设计与实现 毕业设计论文说明书 2万+字 共97页.pdf
03-05
"这篇毕业设计论文详细介绍了基于JavaEE、JSP语言和MySQL数据库的企业员工信息管理系统的设计与实现。系统分为管理员和普通员工两个模块，实现了包括部门管理、员工信息管理、出勤管理、工资管理和请假审核等功能。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值