用户登陆界面和注册界面

用户登录功能的简单实现

工具:IntelliJ IDEA Community Edition 2021.3.3、MySQL、MySQL连接驱动:mysql-connector-java-5.1.32.jar、mybatis-3.5.5、javax.servlet-3.1.0、tomcat7

一、表单登录

一、表单登录
1)表单
设置:表单提交地址、表单类型、id属性值

2)表单元素
文本框 设置name和id属性值
密码框 设置name和id属性值
普通按钮 设置id属性值,绑定点击事件

3)登录表单校验
(1)获取表单元素的值
(2)判断表单元素是否存在于数据库中
如果存在,显示登陆成功;如果不存在,则显示登陆失败。

4)注册表单校验
(1)获取表单元素的值
(2)判断表单元素是否存在于数据库中
如果存在,显示用户名已存在;如果不存在,则注册成功,插入数据库,显示注册成功。

具体实现

1.新建maven web项目,使用骨架:从archetype创建,选择maven-archetype-web。


2.删除pom.xml里不需要的
3.右键点击main,新建目录,导入Java和resources


4.pom.xml中配置Tomcat插件,并且修改port为80

 5.导入servlet依赖,并设置依赖范围为provided


6.创建数据库,创建tb_user表,Java中创建User实体类,并插入测试数据


7.在Pom.xml中导入MyBatis坐标,导入mysql驱动坐标


8.在resources下创建mybatis-config.xml核心配置文件连接数据库和UserMapper.xml映射文件操作数据,Java中编写UserMapper接口

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.mjk.mapper.UserMapper">
    <insert id="add">insert into tb_user values(null,#{username},#{password})</insert>
    <select id="select" resultType="com.mjk.pojo.User">select * from tb_user where username = #{username} and password = #{password}</select>
    <select id="selectById" resultType="com.mjk.pojo.User">select * from tb_user where username = #{username}</select>
</mapper>
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configuration
        PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <!--起别名-->
    <typeAliases>
        <package name="com.mjk.pojo"/>
    </typeAliases>

    <environments default="development">
        <environment id="development">
            <transactionManager type="JDBC"/>
            <dataSource type="POOLED">
                <property name="driver" value="com.mysql.jdbc.Driver"/>
                <property name="url" value="jdbc:mysql://localhost:3306/db1?useSSL=false&amp;useServerPrepStmts=true"/>
                <property name="username" value="root"/>
                <property name="password" value="123456"/>
            </dataSource>
        </environment>
    </environments>
    <mappers>
        <!--扫描mapper-->
        <mapper resource="com/mjk/mapper/UserMapper.xml"/>
    </mappers>
</configuration>
package com.mjk.mapper;

import com.mjk.pojo.User;
import org.apache.ibatis.annotations.Param;

/**
 * @author: 缪锦康
 * @date 2022/9/18 20:59
 */
public interface UserMapper {
    User select(@Param("username") String username,@Param("password") String password);
    User selectById(String username);
    void add(User user);
}

 9.在pojo包下创建User类,编写user对象

package com.mjk.pojo;

/**
 * @author: 缪锦康
 * @date 2022/9/18 20:32
 */
public class User {
    private Integer id;
    private String username;
    private String password;

    public Integer getId() {
        return id;
    }

    public void setId(Integer 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;
    }

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

 10.创建login.html和register.html来发送登录和注册信息

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>login</title>
    <link href="css/login.css" rel="stylesheet">
</head>

<body>
<div id="loginDiv">
    <form action="/anli01/loginServlet"  method="post">
        <h1 id="loginMsg">LOGIN IN</h1>
        <p>Username:<input id="username" name="username" type="text"></p>

        <p>Password:<input id="password" name="password" type="password"></p>

        <div id="subDiv">
            <input type="submit" class="button" value="login up">
            <input type="reset" class="button" value="reset">&nbsp;&nbsp;&nbsp;
            <a href="register.html">没有账号?点击注册</a>
        </div>
    </form>
</div>

</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>欢迎注册</title>
    <link href="css/register.css" rel="stylesheet">
</head>
<body>

<div class="form-div">
    <div class="reg-content">
        <h1>欢迎注册</h1>
        <span>已有帐号?</span> <a href="login.html">登录</a>
    </div>
    <form id="reg-form" action="/anli01/registerServlet" method="post">

        <table>

            <tr>
                <td>用户名</td>
                <td class="inputs">
                    <input name="username" type="text" id="username">
                    <br>
                    <span id="username_err" class="err_msg" style="display: none">用户名格式有误</span>
                </td>

            </tr>

            <tr>
                <td>密码</td>
                <td class="inputs">
                    <input name="password" type="password" id="password">
                    <br>
                    <span id="password_err" class="err_msg" style="display: none">密码格式有误</span>
                </td>
            </tr>


        </table>

        <div class="buttons">
            <input value="注 册" type="submit" id="reg_btn">
        </div>
        <br class="clear">
    </form>

</div>
</body>
</html>

11.创建LoginServlet和RegisterServlet来接收登录和注册信息

package com.mjk.web;

import com.mjk.mapper.UserMapper;
import com.mjk.pojo.User;
import org.apache.ibatis.io.Resources;
import org.apache.ibatis.session.SqlSession;
import org.apache.ibatis.session.SqlSessionFactory;
import org.apache.ibatis.session.SqlSessionFactoryBuilder;
import com.*;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.xml.ws.Response;
import java.io.IOException;
import java.io.InputStream;
import java.io.PrintWriter;

/**
 * @author: 缪锦康
 * @date 2022/9/20 12:57
 */
@WebServlet("/loginServlet")
public class LoginServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String username = req.getParameter("username");
        String password = req.getParameter("password");
        //1.获取sqlSessionFactory对象
        String resource = "mybatis-config.xml";
        InputStream inputStream = Resources.getResourceAsStream(resource);
        SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
        //2.获取sqlSession对象
        SqlSession sqlSession=sqlSessionFactory.openSession();
        //3.获取Mapper
        UserMapper userMapper = sqlSession.getMapper(UserMapper.class);
        //4.调用方法
        User user = userMapper.select(username,password);
        //5.释放资源
        sqlSession.close();
        //设置输出字符集
        resp.setContentType("text/html;charset=utf-8");
        PrintWriter writer = resp.getWriter();
        if(user!=null){
            writer.write("登陆成功");
        }else {
            writer.write("登陆失败");
        }
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        this.doGet(req, resp);
    }
}
package com.mjk.web;

import com.mjk.mapper.UserMapper;
import com.mjk.pojo.User;
import org.apache.ibatis.io.Resources;
import org.apache.ibatis.session.SqlSession;
import org.apache.ibatis.session.SqlSessionFactory;
import org.apache.ibatis.session.SqlSessionFactoryBuilder;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.InputStream;
import java.io.PrintWriter;

/**
 * @author: 缪锦康
 * @date 2022/9/20 15:05
 */
@WebServlet("/registerServlet")
public class RegisterServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String username = req.getParameter("username");
        String password = req.getParameter("password");
        User user = new User();
        user.setUsername(username);
        user.setPassword(password);
        //1.获取sqlSessionFactory对象
        String resource = "mybatis-config.xml";
        InputStream inputStream = Resources.getResourceAsStream(resource);
        SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
        //2.获取sqlSession对象
        SqlSession sqlSession=sqlSessionFactory.openSession();
        //3.获取Mapper
        UserMapper userMapper = sqlSession.getMapper(UserMapper.class);
        //4.调用方法
        User user1 = userMapper.selectById(username);
        //设置输出字符集
        resp.setContentType("text/html;charset=utf-8");
        PrintWriter writer = resp.getWriter();
        if(user1!=null){
            writer.write("账户已存在");
        }else{
            userMapper.add(user);
            sqlSession.commit();
            writer.write("创建成功");
        }
        //5.释放资源
        sqlSession.close();
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        this.doGet(req, resp);
    }
}

页面展示:

登陆页面

注册页面 

总结:

通过xml 文件或注解的方式将要执行的各种 statement 配置起来,并通过java对象和 statement中sql的动态参数进行映射生成最终执行的sql语句,最后由mybatis框架执行sql并将结果映射为java对象并返回。(从执行sql到返回result的过程)。

1)Dao接口,就是Mapper接口。

2)接口的全限名,就是映射文件中的namespace的值;

3)接口的方法名,就是映射文件中Mapper的Statement的id值;

4)接口方法内的参数,就是传递给sql的参数。

Mybatis的Xml映射文件中,不同的Xml映射文件,id是否可以重复?

不同的Xml映射文件,如果配置了namespace,那么id可以重复;如果没有配置namespace,那么id不能重复;原因就是namespace+id是作为Map的key使用的,如果没有namespace,就剩下id,那么,id重复会导致数据互相覆盖。有了namespace,自然id就可以重复,namespace不同,namespace+id自然也就不同。

Mybatis的Xml映射文件中,不同的Xml映射文件,id是否可以重复?

不同的Xml映射文件,如果配置了namespace,那么id可以重复;如果没有配置namespace,那么id不能重复;原因就是namespace+id是作为Map的key使用的,如果没有namespace,就剩下id,那么,id重复会导致数据互相覆盖。有了namespace,自然id就可以重复,namespace不同,namespace+id自然也就不同。

  • 7
    点赞
  • 90
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值