Web+Tomcat+Servlet+MySQL实现登录页面【JavaWeb笔记一】

目录

功能描述：

实现框图：

具体实现过程

一、环境搭建

服务器环境搭建：

页面部分环境搭建：

数据库部分环境搭建：

二、代码实现过程

1、创建一个带表单提交的 html 页面（login.html）

2、在 web.xml 文件下绑定 Servlet 的对象类

3、创建 java （LoginServer.java） 类来执行 Servlet 操作

4、jdbc 完成数据库部分操作 （Demo.java）

5、通过测试 @Test 完成数据库的连接测试  

---

功能描述：

网页登录模块，页面有表单验证，后台连接数据库真实判断， 跳转到不同页面给用户提示（页面如下图）

 

实现框图：

网页登录->访问服务器->查询数据库->返回结果->页面显示登陆结果（实现框图如下图）

 

具体实现过程

 

一、环境搭建

服务器环境搭建：

【本项目基于IDEA+Tomcat】所以需要在IEDA上配置Tomcat：

Run > Edit Configurations > Application server : 配置 Tomcat 服务器

 

页面部分环境搭建：

1、创建的是JavaEE项目 > Additional Libraries and Frameworks : 勾选Web Application

2、WEB-INF 下创建 classes（用于放置之后生成的字节文件）

                 File > Project Structure > Modules > Path >选择输出路径 Use module compile output path

                 lib（用于存放之后项目需要用到的依赖包）

                 File > Project Structure > Modules > Dependencies > + (指定当前目录下的lib) > jar directory

3、后面连接数据库，需要将jdbc的驱动（依赖jar包），放到次目录下（web/WEB-INF/lib）

 

数据库部分环境搭建：

1、为了完成数据库操作，需要引入测试 @Test 来测试数据库操作是否正常

创建一个 test 文件夹，并将其转换为测试文件夹 右键： > Mark Directory as > Test Sources Root

2、创建一个lib文件夹 用于存放依赖包

3、引入依赖包：①junit-4.8.jar  ②mysql-connector-java-5.1.37-bin.jar

File > Project Structure > Libraines > + （选择当前项目文件夹）> + (classes) 导入lib下的 junit 和 mysql-connector > 不加载modules

File > Project Structure > Modules > Path > Dependencies > + > 2 Library > java > 选择当前项目文件夹

 

二、代码实现过程

1、创建一个带表单提交的 html 页面（login.html）

 

提交跳转到/login  请求方法为Post

~/web/login.html


    
    
    




    
登录模块
    
        Username请输入用户名称


        Password请输入账户密码


        
        
    

 

2、在 web.xml 文件下绑定 Servlet 的对象类

~/web/WEB-INF/web.xml


    login                      
    com.yuyu.LoginServer     


    login                      
    /login                       

 

3、创建 java （LoginServer.java） 类来执行 Servlet 操作

public class LoginServer extends HttpServlet{}     继承 HTTPServlet 来重载 Servlet中的方法

~/src/com/yuyu/web/LoginServer.java

public class LoginServer extends HttpServlet {
    //数据库操作对象
    Demo1 demo1 = new Demo1();

    /**
     * 处理 Get 方法
     * @param req   请求对象
     * @param resp  响应对象
     */
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //处理Get方法
        //Get方法登录时直接跳转到loginError页面
        //req.getRequestDispatcher("loginError.html").forward(req,resp);
        //由后台给前台返回一段js代码
        resp.setContentType("text/html;charset=utf-8");
        PrintWriter writer = resp.getWriter();
        writer.print("");
    }

    /**
     * 处理 Post 方法
     * @param req     请求对象
     * @param resp    响应对象
     */
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //处理Post方法
        //处理编码问题
        req.setCharacterEncoding("utf-8");
        //1、接收参数     根据参数得到前端请求的内容
        String username = req.getParameter("username");
        String password = req.getParameter("password");
        System.out.println("username="+username+",password="+password);
        //2、跳转页面测试
        Person person = null;
        try {
            //通过得到的内容查询数据库，如果能查询到结果则返回一个person对象，查不到返回 null
            person = Demo1.selectPerson(username,password);
        } catch (Exception e) {
            e.printStackTrace();
        } 
        // 非空则说明查询到了对象 直接跳转到相应界面
        if (person != null) {
            //跳转到 success.html 显示登陆成功的页面
            req.getRequestDispatcher("/success.html").forward(req, resp);
        }else {
            //跳转到 error.html 显示登陆失败的页面
            req.getRequestDispatcher("/error.html").forward(req, resp);
        }
    }

    @Override
    public void destroy() {
        System.out.println("销毁方法");
    }

    @Override
    public void init() throws ServletException {
        System.out.println("初始化");
    }
}

 

4、jdbc 完成数据库部分操作 （Demo.java）

使用 jdbc 操作数据库的必要步骤：

 //1. 加载数据库驱动
Class.forName("com.mysql.jdbc.Driver");
//2. 通过驱动管理器，获取JDBC的连接对象
//   连接地址格式：
//      主协议：子协议：//ip地址：端口号/数据库名称
//      mysql(的格式): [jdbc:mysql://localhost:3306/users(useUnicode=true&characterEncoding=utf-8)[加上编码]]
Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/users?useUnicode=true&characterEncoding=utf-8","root","123465");
//3. 通过连接对象，创建SQL执行对象（SQL执行环境）
Statement state = conn.createStatement();
//4. 通过SQL执行对象，执行SQL
//excute()增删改查都能执行，有返回值：真假
// 但返回值true代表有结果集返回，假为返回不是结果集（不是执行失败）
state.execute("create table person(id int primary key auto_increment,username varchar(20),password varchar(20))");
//state.executeUpdate();执行增删改
//state.executeQuery();执行查询
//5. 释放连接
state.close();
conn.close();

 

创建表格：

~/src/com/yuyu/dao/Demo1.java

创建表格：
public static void createTable() throws ClassNotFoundException, SQLException {
    //1. 加载数据库驱动
    Class.forName("com.mysql.jdbc.Driver");
    //2. 通过驱动管理器，获取JDBC的连接对象
    Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/users?useUnicode=true&characterEncoding=utf-8","root","123465");
    //3. 通过连接对象，创建SQL执行对象（SQL执行环境）
    Statement state = conn.createStatement();
    //4. 通过SQL执行对象，执行SQL
    state.execute("create table person(id int primary key auto_increment,username varchar(20),password varchar(20))engine=innodb default charset=utf8");
    //5. 释放连接
    state.close();
    conn.close();
}

 

插入数据：

public static void insertData() throws ClassNotFoundException, SQLException {
    Class.forName("com.mysql.jdbc.Driver");
    Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/usersuseUnicode=true&characterEncoding=utf-8","root","123465");
    Statement state = conn.createStatement();
    state.execute("insert into person values(null,'123','123')");
    state.execute("insert into person values(null,'456','456')");
    state.execute("insert into person values(null,'789','789')");
    state.execute("insert into person values(null,'000','000')");
    state.close();
    conn.close();
}

 

查询数据：返回一个person对象，用于 Servlet 响应请求

public static Person selectPerson(String username,String password) throws ClassNotFoundException, SQLException {
    Class.forName("com.mysql.jdbc.Driver");
    Connection conn = DriverManager.getConnection("jdbc:mysql://localhost:3306/users?useUnicode=true&characterEncoding=utf-8","root","123465");
    Statement state = conn.createStatement();
    //查询结果返回的是一个结果集
    ResultSet res = state.executeQuery("select * from person where username='" + username + "' and password='" + password + "'");
    int id = 0;
    String usernameCheck = null;
    String passwordCheck = null;
    Person person = null;
    while (res.next()){
        id = res.getInt("id");
        usernameCheck = res.getString("username");
        passwordCheck = res.getString("password");
        System.out.println("有此用戶：id="+id+";username="+usernameCheck+";password="+passwordCheck);
        person = new Person(id,usernameCheck,passwordCheck);
    }
    res.close();
    state.close();
    conn.close();
    return person;
}

 

5、通过测试 @Test 完成数据库的连接测试  

Ctrl + shift + T 创建测试类  （在 test 目录下的 Demo1Test.java）

~/test/com/yuyu/dao/Demo1Test.java

public class Demo1Test {

    @Test
    public void createTable() throws SQLException, ClassNotFoundException {
        Demo1.createTable();
    }

    @Test
    public void insertData() throws SQLException, ClassNotFoundException {
        Demo1.insertData();
    }

    @Test
    public void selectPerson() throws SQLException, ClassNotFoundException {
        Demo1.selectPerson("123","123");
    }
}