[Java知识库] Javaweb实现动态登入(包含坑点和痛点)

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> Java知识库 -> Javaweb实现动态登入(包含坑点和痛点) -> 正文阅读

[Java知识库]Javaweb实现动态登入(包含坑点和痛点)

具体功能操作

别点为了传给博客才发的

1.界面展示

在这里插入图片描述

登入界面

在这里插入图片描述

注册界面(有js的表单验证功能)

在这里插入图片描述

文件位置界面与功能

在这里插入图片描述
1.实现链接数据库和执行增加和查找
2.执行servlet的post方法
3.不用XML前后端的映射
4.登入失败的界面
5.自带的
6.我的首页的界面
7.登入成功的界面

2.代码

1.JDBC

package com.example.mytest;
import java.sql.*;

public class JDBC {
    PreparedStatement pps = null;
    Connection connection=null;
    ResultSet resultSet=null;
    public void insert(String userName,String userPass){
        try {
            Class.forName("com.mysql.cj.jdbc.Driver");
            String uName="root";
            String password="123456";
            String url="jdbc:mysql://localhost:3306/user?serverTimezone=UTC";
            connection= DriverManager.getConnection(url,uName,password);
            String sql="insert into userinform (account,password)values(?,?)";
            pps= connection.prepareStatement(sql);
            pps.setString(1,userName);
            pps.setString(2,userPass);
            pps.executeUpdate();
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        } catch (SQLException e) {
            e.printStackTrace();
        } finally {
            try {
                if(connection!=null){
                    connection.close();
                }
                if (pps != null) {
                    pps.close();
                }
                if (resultSet != null) {
                    resultSet.close();
                }
            } catch (SQLException throwables) {
                throwables.printStackTrace();
            }
        }
    }
    public int select(String userName,String userPass){
        int count = 0;
        try {
            Class.forName("com.mysql.cj.jdbc.Driver");
            String uName="root";
            String password="123456";
            String url="jdbc:mysql://localhost:3306/user?serverTimezone=UTC";
            connection= DriverManager.getConnection(url,uName,password);
            String sql="select * from userinform where account=? and password=?";
            pps= connection.prepareStatement(sql);
            pps.setString(1,userName);
            pps.setString(2,userPass);

            resultSet= pps.executeQuery();
            if(resultSet.next()){
                System.out.println("登入成功!");
                count= 1;
            }else {
                System.out.printf("登入失败!");
                count=0;
            }
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        } catch (SQLException e) {
            e.printStackTrace();
        } finally {
            try {
                if(connection!=null){
                    connection.close();
                }
                if (pps != null) {
                    pps.close();
                }
                if (resultSet != null) {
                    resultSet.close();
                }
            } catch (SQLException throwables) {
                throwables.printStackTrace();
            }
        }
        return count;
    }

}

因为就两个操作(增加和查找)就没有封装成一个DButil
2.userServlet

package com.example.mytest;

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 usersServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        JDBC jdbc=new JDBC();
        req.setCharacterEncoding("utf-8");
        String  userName = req.getParameter("userName");
        String  userPass = req.getParameter("userPass");
        String value=req.getParameter("resign");
        int i= Integer.parseInt(value);
        if(i==1){
           int j= jdbc.select(userName,userPass);
           if(j==1){
               req.getRequestDispatcher("/success.html").forward(req,resp);
           }req.getRequestDispatcher("/false.html").forward(req,resp);

        }else {
            jdbc.insert(userName,userPass);
            System.out.println("post--->"+userName+","+userPass);
        }
        req.getRequestDispatcher("/success.html").forward(req,resp);
    }
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp)  {

        String uage = req.getParameter("uage");
        String upass = req.getParameter("upass");
        System.out.println(uage+"---"+upass);
    }
}

3.XML文件

<?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">
    <servlet>
        <servlet-name>b1</servlet-name>
        <servlet-class>
            com.example.mytest.usersServlet
        </servlet-class>
    </servlet>
    <servlet-mapping>
        <servlet-name>b1</servlet-name>
        <url-pattern>/testrequest</url-pattern>
    </servlet-mapping>
</web-app>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登入失败</title>
</head>
<body>
<h1>登入失败请验证信息</h1>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登入成功</title>
</head>
<body>
<h1>恭喜登入成功</h1>
</body>
</html>

6.登入界面

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>导航栏</title>
  <script type="text/javascript" src="js/jquery-1.11.1.js"></script>
  <script type="text/javascript" src="js/bootstrap.js"></script>
  <link rel="stylesheet" href="css/bootstrap.css" />
  <script type="text/javascript" src="js/myJs.js" >
  </script>
  <style>
    a{
      margin-left: 60px;
    }
  </style>
</head>

<body>
<nav class="navbar navbar-default" role="navigation">
  <a class="navbar-brand" href="#">程序员创新大会</a>
  <div class="navbar-header">
    <ul class="nav nav-pills">
      <li class="active"><a href="导航栏.html">首页</a></li>
      <li><a data-toggle="modal" data-target="#myModal">登入</a></li>
      <li><a data-toggle="modal" data-target="#myModal2">注册</a></li>
      <li><a href="#">关于我们</a></li>
      <li class="dropdown">
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">
          优秀员工 <span class="caret"></span>
        </a>
        <ul class="dropdown-menu">
          <li><a href="#">张三</a></li>
          <li><a href="#">李四</a></li>
          <li><a href="#">王二</a></li>
          <li class="divider"></li>
          <li><a href="#">更多....</a></li>
        </ul>
      </li>
      <li><a href="大众评论.html">大众评论</a></li>
    </ul>
  </div>
  <div style="float: right;">
    <form class="navbar-form navbar-left" role="search">
      <div class="form-group">
        <input type="text" class="form-control" placeholder="Search">
      </div>
      <button class="btn glyphicon glyphicon-search"></button>
    </form>
  </div>
</nav>
<div id="myCarousel" class="container carousel slide">
  <ol class="carousel-indicators">
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
    <li data-target="#myCarousel" data-slide-to="1"></li>
    <li data-target="#myCarousel" data-slide-to="2"></li>
  </ol>
  <div class="carousel-inner">
    <div class="item active">
      <img src="img/nav1.jpg" />
      <div class="carousel-caption">第一张图</div>
    </div>
    <div class="item ">
      <img src="img/nav2.jpg" />
      <div class="carousel-caption">第二张图</div>
    </div>
    <div class="item ">
      <img src="img/nav3.jpg" />
      <div class="carousel-caption">第三张图</div>
    </div>
  </div>
  <a href="#myCarousel" class="carousel-control left" data-slide="prev">&lt;</a>
  <a href="#myCarousel" class="carousel-control right" data-slide="next">&gt;</a>
</div>
<form action="testrequest" method="post" class="form-horizontal" role="form" >
<div id="myModal" class=" container modal fade">
  <div class="modal-dialog">
    <div class="modal-content col-sm-8">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">请登入</h4>
      </div>
      <div class="modal-body">
          <div class="form-group">
            <label  class="col-sm-3 control-label"><span class="glyphicon glyphicon-user">账号：</span></label>
            <div class="col-sm-8">
              <input name="userName" type="text" name="stuId" class="form-control" />
            </div>
          </div>
          <div class="form-group">
            <label  class="col-sm-3 control-label"><span class="glyphicon glyphicon-lock">密码：</span></label>
            <div class="col-sm-8">
              <input name="userPass" type="password" class="form-control" />
            </div>
          </div>
      </div>
      <div class="modal-footer">
        <button type="submit" name="resign" value="1"  >提交</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
      </div>
    </div>
  </div>
</div>
</form>
<form action="testrequest" method="post" class="form-horizontal" role="form" onsubmit="register()" >
<div id="myModal2" class=" container modal fade">
  <div class="modal-dialog">
    <div class="modal-content col-sm-8">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h4 class="modal-title">请添加必要信息</h4>
      </div>
      <div class="modal-body">
          <label>
            <p>
              账号:
            </p>
            <input type="text" name="userName" id="useName"  placeholder="请输入账号" onblur="validateName()" /><span id="nameMsg">用户名为至少6位</span>
          </label><br />
          <label>
            <p>密码:</p>
            <input type="password" name="userPass" id="password1" placeholder="请输入密码" onblur="validatepassword()" /><span id="pwdMsg1">密码至少为8位</span>
          </label><br />
          <label>
            <p>确认密码:</p>
            <input type="password" id="password2" placeholder="再次输入密码" onblur="confirmpwd()" /><span id="pwdMsg2">确认密码一致</span>
          </label><br />
          <p>性别:</p>
          <select id="gender" onblur="validategender()">
            <option value="-1">请选择性别</option>
            <option value="0" >女</option>
            <option value="1" >男</option>
          </select><span id="gendermsg"></span><br /><br />
          <p></p>
          <button name="resign" value="9" class="btn btn-success" type="submit" >注册</button>
          <button type="reset "class="btn btn-default">重置</button>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-info" data-dismiss="modal" onclick="alert('!')">提交</button>
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
      </div>
    </div>
  </div>
</div>
</form>
</body>
</html>

界面可以自己编写

3.最主要的还是帮你们避坑吧

1.问题:发现自己的CSS和JS文件没有效果
解决方法:像你导jar包一样要导入依赖中
在这里插入图片描述
2.问题:发现自己代码没错但是有空指针异常说Classforname("…");找不到驱动器但是自己单独用main方法却可以导入数据

解决方法:
当我们发布web项目到tomcat时，访问地址时会报一个classnotfound的错误，但是eclipse中的项目中都已经添加了相应的类，有一种比较容易犯的错误是，你没有把额外所需的jar包加到tomcat中的lib文件夹中，在这里介绍一种在项目中直接添加jar包到lib目录下：
右键已创建的web项目——properties属性——点击Deployment Assembly——Add——双击Java Build Path Entries——将你所需的jar包选中——finish即可。
3.问题:还是找不到Tomcat的目录(lib)
最简单的解决方法:
我因为找不到Tomcat的lib所以我直接简单粗暴的找到了我Tomcat的下载的位置然后找到lib直接将MySQL的jar包粘贴进去了然后完美解决了