用LayUI和Servlet写一个登录注册小功能

本文描述了如何使用LayUI框架创建一个登录页面,包括HTML结构、CSS样式以及表单验证。同时,介绍了在后台Java项目中添加MySQL和ApacheDBUtils相关库,创建User类映射数据库表,以及实现LoginServlet处理登录请求,验证用户名和密码的过程。此外,还涉及了解决中文乱码问题的方法。
摘要由CSDN通过智能技术生成

(1) 在项目的 webapp 文件夹中创建 login.html 文件. 在项目的 webapp 文件夹中引入LayUI 框架, 使用LayUI框架编写 login.html 页面, 页面效果如下: 页面的标题设置为"用户登录". 在webapp文件夹中创建css文件夹, 在css文件夹里创建 login.css 文件, 用于书写 login.html 页面对应的样式. 输入框给出相应的提示. 用户名输入框是必填项, 不填写无法提交, 输入框的name属性值是username.使用 LayUI自带的验证即可 密码输入框是必填项, 不填写无法提交,输入框的name属性值是password.使用LayUI 自带的验证即可 form表单的提交地址是login, 提交方式是POST.

实现页面:

 (2) 往HomeworkServlet02项目的 webapp/WEB-INF/lib 文件夹中加入mysql相关的jar包, 以及apache DBUtils相关的jar包. 在com.lanou.bean包里创建User类, User类与数据库 servlet01的user表相呼应.

public class DruidUtil {
    public static DataSource dataSource = null;

    //1.加载jdbc.properties配置文件
    static {
        try {
            InputStream resourceAsStream = DruidUtil.class.getClassLoader().getResourceAsStream("jdbc.properties");
            Properties properties = new Properties();
            properties.load(resourceAsStream);
            dataSource = DruidDataSourceFactory.createDataSource(properties);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    //获取连接对象
    public static Connection getConn() {
        try {
            Connection connection=dataSource.getConnection();
            //connection.setAutoCommit(false);
            System.out.println(connection);
            return connection;
        } catch (SQLException e) {
            e.printStackTrace();
        }
        return null;
    }

    //释放资源
        public static void release(Connection conn, Statement statement, ResultSet resultSet) {
            if (resultSet!=null) {
                try {
                    resultSet.close();
                } catch (SQLException e) {
                    e.printStackTrace();
                }finally {
                    resultSet = null;
                }
            }
            if (statement!=null) {
                try {
                    statement.close();
                } catch (SQLException e) {
                    e.printStackTrace();
                }finally {
                    statement = null;
                }
            }
            if (conn!=null) {
                try {
                    conn.close();
                } catch (SQLException e) {
                    e.printStackTrace();
                }finally {
                    conn = null;
                }
            }
        }
}

 User类

public class User {
    private int id;
    private String username;
    private String password;

    public int getId() {
        return id;
    }

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

    public String getUsername() {
        return username;
    }

    public void setUsername(String username) {
        this.username = username;
    }

    public String getPassword() {
        return password;
    }

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

    public User(int id, String username, String password) {
        this.id = id;
        this.username = username;
        this.password = password;
    }

    public User() {
    }

    @Override
    public String toString() {
        return "User{" +
                "id=" + id +
                ", username='" + username + '\'' +
                ", password='" + password + '\'' +
                '}';
    }
}

(3) 在com.lanou.servlet包里创建LoginServlet, 处理 login.html 页面的login请求, 使用注 解配置servlet. 在LoginServlet的doPost中根据login请求传递过来的username和password 查询数据库servlet01的user表, 验证是否登录成功. 如果登录成功, 通过response回应"登录 成功", 如果登录失败, 通过response回应"用户名或者密码错误". 由于用户名可能会输入中文, 需要解决中文乱码问题. 由于response返回的信息包含中文, 需要解决中文乱码问题

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

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("UTF-8");
        String username = req.getParameter("username");
        String password = req.getParameter("password");
        boolean isQuery = validateUserInfo(username, password);

        resp.setContentType("text/html;charset=UTF-8");
        PrintWriter out = resp.getWriter();
        if (isQuery) {
            out.println("登录成功");
        } else {
            out.println("用户名或者密码错误");
        }
        out.close();
    }

    private boolean validateUserInfo(String username, String password) {
        Connection conn = null;
        PreparedStatement stmt = null;
        ResultSet rs = null;
        try {
            // 1. 获取数据库连接
            conn = DruidUtil.getConn();
            // 2. 查询 SQL 语句
            String sql = "SELECT * FROM user WHERE username=? AND password=?";

            stmt = conn.prepareStatement(sql);
            stmt.setString(1, username);
            stmt.setString(2, password);
            // 4. 获取结果集
            rs = stmt.executeQuery();
            // 5. 判断结果集是否为空,如果不为空,则表示验证通过,返回true
            return rs.next();
        } catch (SQLException e) {
            e.printStackTrace();
        } finally {
            // 6. 释放资源
            DruidUtil.release(conn, stmt, rs);
        }
        return false;
    }
}

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值