logins登录项目

最新推荐文章于 2023-02-24 23:29:03 发布

彭于晏爱编程

最新推荐文章于 2023-02-24 23:29:03 发布

阅读量1.4k

点赞数

分类专栏：实战项目文章标签：前端服务器 java

本文链接：https://blog.csdn.net/m0_59708269/article/details/122861108

版权

用户登录

用户登录
    1.数据库创建对应的用户表   tb_user(MySql)
    2.前台页面
        登录页面    login.jsp
            用户登录 JS校验
                登录表单校验验证
                1.给登录按钮绑定点击事件
                2.获取用户名和密码的值
                3.判断姓名是否为空
                  如果姓名为空,提示用户(span标签赋值),并且return
                4.判断密码是否为空
                  如果密码为空,提示用户(span标签赋值),并且return
                5.如果都不为空则手动提交表单
        首页       index.jsp
    3.后台实现
        登录功能
            思路:
                1.接受客户端的请求(接收参数:姓名,密码)
                2.参数非空判断
                    如果参数为空,通过消息模型对象返回结果(设置成功状态,设置提示信息,回显数据)
                    将消息模型对象设置到request作用域中,请求转发到request作用域
                    请求转发跳转到登录页面
                    return
                3.通过用户姓名查询用户对象
                4.判断用户对象是否为空
                    如果为空,通过消息模型对象返回结果(设置状态,设置提示信息,回显数据)
                    请求转发跳转到登录页面
                    return
                5.将数据库中查询到的用户密码与前台传递的密码作比较
                    如果不相等,通过消息模型对象返回结果(设置状态,设置提示信息,回显数据)
                    将消息模型对象设置到request作用域中,请求转发到request作用域
                    请求转发跳转到登录页面
                 如果相等,表示登录成功
                    将用户信息设置到session作用域中
                    重定向跳转到首页

分层思想(解耦:高内聚低耦合)
    controller层
        1.接收客户端请求(接收参数:姓名,密码)
        2.调用service层的方法,返回消息模型对象
        3.判断消息模型的状态码
            如果状态码是失败
                将消息模型对象设置到request作用域中,请求转发跳转到login.jsp
            如果状态码是成功
                将消息模型中的用户信息设置到session作用域中,重定向跳转到index.jsp
        4.请求转发跳转到登录页面
        响应结果
    service层(业务逻辑判断)
        1.参数的非空判断
            如果参数为空
                将状态码,提示信息,回显数据设置到消息模型对象中,返回消息模型对象
        2.调用dao层的查询方法,通过用户名查询用户对象
        3.判断用户对象是否为空
                 将状态码,提示信息,回显数据设置到消息模型对象中,返回消息模型对象

        4.判断数据库中查询到的用户密码与前台传递过来的密码作比较
                如果不相等,将状态码,提示信息,回显数据设置到消息模型对象中,返回消息模型对象
        5.登录成功,将成功状态,提示信息,用户对象设置消息模型对象,并return
    mapper层(dao层)
        接口类
        mapper.xml  mybatis与数据库相关的操作
        定义对应的接口
    entity(po,model)
        JavaBean实体
    util
        工具类(通用的方法/类)
    test
        测试类/方法

1.登录页面 login.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户登录</title>


</head>
<body>
<div style="text-align: center">
    <from action="/login"method="post"id="loginForm"action="index.jsp">
        姓名:<input type="text"name="uname"id="uname" value="${messageModel.object.userName}"><br/>
        密码:<input type="password"name="upwd"id="upwd" value="${messageModel.object.userPwd}"><br/>
        <span id="msg" style="font-size: 12px;color: red">${messageModel}</span><br/>
        <button type="button"id="loginBtn">登录</button>
        <button type="button">注册</button>
    </from>
</div>

<%-- 引入Jquery的js文件--%>
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
<script type="text/javascript">
    /**
     *   用户登录 JS校验
     登录表单校验验证
     1.给登录按钮绑定点击事件
     2.获取用户名和密码的值
     3.判断姓名是否为空
     如果姓名为空,提示用户(span标签赋值),并且return
     4.判断密码是否为空
     如果密码为空,提示用户(span标签赋值),并且return
     5.如果都不为空则手动提交表单
     */
    $("#loginBtn").click(function (){
     
        //获取用户名和密码的值
        var uname = $("#uname").val();
        var upwd =  $("#upwd").val();
        //判断姓名是否为空
        if(isEmpty(uname)){
     
            //如果姓名为空,提示用户(span标签赋值),并且return
            $("#msg").html("用户姓名不能为空!")
            return;
        }
        //判断密码是否为空
        if(isEmpty(upwd)){
     
            //如果密码为空,提示用户(span标签赋值),并且return
            $("#msg").html("用户密码不能为空!")
            return;
        }
        //如果都不为空则手动提交表单
        $("#loginForm").submit();
    });

    /**
     * 判断字符串是否为空
     *      如果为空返回true
     *      如果不为空返回false
     */
    function isEmpty(str){
     
        if (str == null || str.trim()

最低0.47元/天解锁文章

彭于晏爱编程

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
5
评论
logins登录项目

用户登录用户登录 1.数据库创建对应的用户表 tb_user(MySql) 2.前台页面登录页面 login.jsp 用户登录 JS校验登录表单校验验证 1.给登录按钮绑定点击事件 2.获取用户名和密码的值 3.判断姓名是否为空如果姓名为空,提示用户(span标签赋值),并
复制链接

扫一扫

专栏目录