用户登录功能实现案例

已于 2022-06-15 15:02:49 修改
阅读量2.1k 收藏 28
点赞数 16
分类专栏： Web前端开发与Vue.js实践 文章标签： 服务器 运维 java html5 css3
于 2022-05-19 18:00:37 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_61961937/article/details/124862350
版权

目录

准备环境：

1、编写静态页面到项目的webapp目录下

login.html代码：

login.html对应的login.css代码：

2、创建db1数据库，创建tb_user表，创建User实体类

创建db1数据库，创建tb_user表

实体类代码：

3、导入MyBatis坐标，MySQL驱动坐标

pom.xml文件：

4、创建mysqls-config.xml核心配置文件，UserMapper.xml映射文件，UserMapper接口

mysqls-config.xml核心配置文件：

UserMapper.xml映射文件：

UserMapper接口：

编写loginServlet代码用于生成连接数据：

执行结果：

 登录成功显示：

登录失败显示：

流程说明：

1、用户填写用户名密码，提交到LoginServlet

2、在LoginServlet使用MyBatis查询数据库，验证用户名密码是否正确

3、如果正确，响应“登录成功，如果错误，响应“登录失败””

ca82d5fc80184811bc2d765af49e0c05.png

准备环境：

1、编写静态页面到项目的webapp目录下

login.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="/Webapp/loginServlet" method="post" id="form">
        <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>

login.html对应的login.css代码：

* {
    margin: 0;
    padding: 0;
}

html {
    height: 100%;
    width: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
    background: url(../imgs/Desert.jpg) no-repeat 0px 0px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    -moz-background-size: 100% 100%;
}

body {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

#loginDiv {
    width: 37%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 300px;
    background-color: rgba(75, 81, 95, 0.3);
    box-shadow: 7px 7px 17px rgba(52, 56, 66, 0.5);
    border-radius: 5px;
}

#name_trip {
    margin-left: 50px;
    color: red;
}

p {
    margin-top: 30px;
    margin-left: 20px;
    color: azure;
}

input {
    margin-left: 15px;
    border-radius: 5px;
    border-style: hidden;
    height: 30px;
    width: 140px;
    background-color: rgba(216, 191, 216, 0.5);
    outline: none;
    color: #f0edf3;
    padding-left: 10px;
}
#username{
    width: 200px;
}
#password{
    width: 202px;
}
.button {
    border-color: cornsilk;
    background-color: rgba(100, 149, 237, .7);
    color: aliceblue;
    border-style: hidden;
    border-radius: 5px;
    width: 100px;
    height: 31px;
    font-size: 16px;
}

#subDiv {
    text-align: center;
    margin-top: 30px;
}
#loginMsg{
    text-align: center;color: aliceblue;
}

2、创建db1数据库，创建tb_user表，创建User实体类

创建db1数据库，创建tb_user表

1a0a26ccacbb4b5598b658453d288522.png

 实体类代码：

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 + '\'' +
                '}';
    }
}

 

3、导入MyBatis坐标，MySQL驱动坐标

pom.xml文件：

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>

    <groupId>org.example</groupId>
    <artifactId>Webapp</artifactId>
    <version>1.0-SNAPSHOT</version>

    <packaging>war</packaging>

    <properties>
        <maven.compiler.source>17</maven.compiler.source>
        <maven.compiler.target>17</maven.compiler.target>
    </properties>

    <dependencies>
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>javax.servlet-api</artifactId>
            <version>3.1.0</version>
            <scope>provided</scope>
        </dependency>

        <dependency>
            <groupId>commons-io</groupId>
            <artifactId>commons-io</artifactId>
            <version>2.6</version>
        </dependency>

        <dependency>
            <groupId>org.mybatis</groupId>
            <artifactId>mybatis</artifactId>
            <version>3.5.5</version>
        </dependency>

        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <version>5.1.34</version>
        </dependency>
    </dependencies>


    <build>
        <plugins>
            <!-- tomcat 插件-->
            <plugin>
                <groupId>org.apache.tomcat.maven</groupId>
                <artifactId>tomcat7-maven-plugin</artifactId>
                <version>2.2</version>
            </plugin>
        </plugins>
    </build>
</project>

4、创建mysqls-config.xml核心配置文件，UserMapper.xml映射文件，UserMapper接口

mysqls-config.xml核心配置文件：

<?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.itheima.pojo"/>
    </typeAliases>

    <environments default="development">
        <environment id="development">
            <transactionManager type="JDBC"/>
            <dataSource type="POOLED">
                <property name="driver" value="com.mysql.cj.jdbc.Driver"/>
                <property name="url" value="jdbc:mysql:///db1?useUnicode=true&amp;characterEncoding=utf-8&amp;serverTimezone=Asia/Shanghai"/>
                <property name="username" value="数据库用户名"/>
                <property name="password" value="数据库密码"/>
            </dataSource>
        </environment>
    </environments>
    <mappers>
        <!--扫描mapper-->
        <package name="com.itheima.mapper"/>
    </mappers>
</configuration>

UserMapper.xml映射文件：

<?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.itheima.mapper.UserMapper">

</mapper>

UserMapper接口：

import com.itheima.pojo.User;
import org.apache.ibatis.annotations.Param;
import org.apache.ibatis.annotations.Select;

public interface UserMapper {

    /**
     * 根据用户名和密码查询用户对象
     * @param username
     * @param password
     * @return
     */
    @Select("select * from tb_user where username = #{username} and password = #{password}")
    User select(@Param("username") String username, @Param("password") String password);
}

编写loginServlet代码用于生成连接数据：

import com.itheima.mapper.UserMapper;
import com.itheima.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.*;
import javax.servlet.http.*;
import javax.servlet.annotation.*;
import java.io.IOException;
import java.io.InputStream;
import java.io.PrintWriter;

@WebServlet("/loginServlet")
public class LoginServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //1、用户名和密码
        String username = request.getParameter("username");
        String password = request.getParameter("password");

        //2、调用MyBatis完成查询
        //2.1 获取SqlSessionFactory对象
        String resource = "mybatis-config.xml";
        InputStream inputStream = Resources.getResourceAsStream(resource);
        SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);
        //2.2 获取SqlSession对象
        SqlSession sqlSession = sqlSessionFactory.openSession();
        //2.3 获取Mapper
        UserMapper userMapper = sqlSession.getMapper(UserMapper.class);
        //2.4 使用方法
        User user = userMapper.select(username, password);
        //2.5 释放资源
        sqlSession.close();

        response.setContentType("text/html;charset=utf-8");
        PrintWriter writer = response.getWriter();
        //3 判断user释放null
        if(user != null){
            // 登陆成功
            writer.write("登录成功");
        } else {
            // 登陆失败
            writer.write("登录失败");
        }
    }

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

执行结果：

2912ada4c66d45128e33728f802547e4.png

 登录成功显示：

df17849acbdb45ac81168e491edb4f2f.png

登录失败显示：

6696e6de03774406a9ed2d88326917f8.png

 

夏志121
关注
  • 16
    点赞
  • 踩
  • 28
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
用户登录功能的实现
xzy的博客
05-02 2万+
文章目录用户登录功能的实现在SpringBoot中配置数据库信息以及mybatis的相关信息数据库easyuser表和User实体类前端vue脚手架向SpringBoot后端发送登录请求SpringBoot后端的LoginController控制器的login方法UserDao动态代理接口中的getUserByMessage方法UserDao.xml映射文件路由跳转到Home.vue组件测试 用户登录功能的实现 在SpringBoot中配置数据库信息以及mybatis的相关信息 如下图： 数据库easyu
JSP实现用户登录、注册和退出功能
10-22
主要为大家详细介绍了JSP实现用户登录、注册和退出功能，具有实用性和参考价值，感兴趣的小伙伴们可以参考一下
实现用户登录功能
m0_62491877的博客
06-13 1382
登录页面login.jsp，输入用户名和密码后，跳转到登录处理程序LoginServlet进行业务逻辑处理，调用服务层，服务层调用数据访问层（DAO），连接数据库，查询数据库，以此判断是否登录成功。登录成功，跳转到登录成功页面success.jsp，否则跳转到登录失败页面failure.jsp。登录页面login.jsp，输入用户名和密码后，跳转到登录处理程序LoginServlet进行业务逻辑处理，登录成功，跳转到登录成功页面success.jsp，否则跳转到登录失败页面failure.jsp。
Java CRM系统用户登录功能实现代码实例
08-19
主要介绍了Java CRM系统用户登录功能实现代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
用户注册与登录功能（完整实现的思路分析）
最新发布
/*多学习 不油腻*/
03-09 4688
注册登录功能在技术上并不复杂，但它在应用中扮演着至关重要的角色。它涉及到用户数据的存储、验证、安全等多个方面，因此需要考虑多个因素来确保功能的稳定性和安全性。
Java Web应用小案例：实现用户登录功能
XLLLXX的博客
06-09 996
登录页面login.jsp，输入用户名和密码后，跳转到登录处理程序LoginServlet进行业务逻辑处理，登录成功，跳转到登录成功页面success.jsp，否则跳转到登录失败页面failure.jsp。登录页面login.jsp，输入用户名和密码后，跳转到登录处理页面doLogin.jsp进行业务逻辑处理，登录成功，跳转到登录成功页面success.jsp，否则跳转到登录失败页面failure.jsp。在net.huawei根包里创建servlet子包，在子包里创建LoginServlet类。
springboot实现简单的注册登录功能
热门推荐
Java721的博客
02-22 2万+
spring官网 通过spring官网初始化SpringBoot项目 使用idea工具打开Springboot项目，项目结构 添加pom依赖 <!--springboot启动类--> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter</artifactId>
管理系统用户登录功能
JAVA领域优质创作者，基于分片网络查询方法专利发明者。
08-23 4786
任何一个管理信息系统都会有登录功能。我们简单可以通过用户名加密码加验证码进行登录。但是就是一个这样的简单功能却涉及的要求很多。 比如对账号的要求，对密码复杂度的要求，对登录时长的要求，对密码有效期的要求，对登录用户登录日志的记录，登录用户的权限等等。非常非常多。本文就介绍简单的登录功能。
数据库设计
gx_up
11-22 1305
一、用户登录信息表（Sys_UserLogOn） 序号 列名 数据类型 长度 小数位 标识 主键 外键 允许空 默认值 说明 1 ...
（一）JavaWeb实现用户登录注册功能（超详细版）---登录
qq_64995702的博客
12-07 4828
Web层，Service层，Dao层。Web层：负责前端展示和用户请求的处理。Service层：对Dao层的数据操作进行组合和封装，实现更高层次的业务逻辑。验证逻辑：Service层可以对用户输入的用户名和密码进行验证。检查用户名和密码是否为空、是否符合规定的格式要求，以及与数据库中存储的用户信息进行比对验证等。通过Service层的验证逻辑，可以确保用户输入的凭据是有效和正确的。加密和解密：在用户登录中，密码需要进行加密存储提高安全性。
Java Web实现用户登录功能
justin02191004的博客
06-09 4968
登录页面login.jsp，输入用户名和密码后，跳转到登录处理程序LoginServlet进行业务逻辑处理，调用服务层，服务层调用数据访问层（DAO），连接数据库，查询数据库，以此判断是否登录成功。登录成功，跳转到登录成功页面success.jsp，否则跳转到登录失败页面failure.jsp。登录页面login.jsp，输入用户名和密码后，跳转到登录处理页面doLogin.jsp进行业务逻辑处理，登录成功，跳转到登录成功页面success.jsp，否则跳转到登录失败页面failure.jsp。
Android实现简单用户注册案例
08-19
主要为大家详细介绍了Android实现简单用户注册案例，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
JavaWeb实现用户登录注册功能实例代码(基于Servlet+JSP+JavaBean模式)
10-22
主要基于Servlet+JSP+JavaBean开发模式实现JavaWeb用户登录注册功能实例代码，非常实用，本文介绍的非常详细，具有参考借鉴价值，感兴趣的朋友一起看看吧
PHP实现用户登录的案例代码
12-18
在Web应用开发中，经常需要实现用户登录的功能。假设一个名为username的用户，当该用户进入网站首页时，如果还未登录，则页面会提示登录，用户输入登录信息进行验证，验证通过进入用户中心，否则显示用户名或密码...
Android实现登录界面和功能实例
10-30
最近一个android小程序需要登录功能，我简单实现了一下。这是整个工程源码，注释嘛，还算详细吧
案例练习——用户登录
qq_42102911的博客
10-12 1310
## 用户登录案例： * 用户登录案例需求 : 1. 编写login.html登录页面 username & password 两个输入框 2. 使用Druid 数据库连接池技术，操作mysql，day14数据库中的user表 3. 使用JDBCTemplate技术封装JD...
SQL笔记
weixin_42166745的博客
10-30 3330
登录：mysql -hlocalhost -uroot -p 展示所有的数据库：show databases; 创建数据库：create database 数据库名； 删除数据库：drop database 数据库名； 使用（进入）数据库：use 数据库名； \c 结束当前sql语句,\q 退出数据库； is null is not null where comm is not null; in notin select * from 数据库名w...
用户登录注册案例（Vue路由）
qq_68383591的博客
05-06 2240
准备工作1.安装git-bash安装命令行工具Git一路next即可（建议不要放C盘）2.安装nodeJS环境。
javaweb分层实现注册功能案例
05-13
好的，下面是一个简单的 JavaWeb 分层实现注册功能的案例： 首先，我们需要创建一个 User 实体类，保存用户信息： ```java public class User { private int id; private String username; private String password; private String email; // 省略 getter 和 setter 方法 } ``` 接着，我们创建一个 UserDao 接口，定义增删改查等操作： ```java public interface UserDao { // 添加用户 void addUser(User user) throws SQLException; // 根据用户名查找用户 User findUserByUsername(String username) throws SQLException; // 根据邮箱查找用户 User findUserByEmail(String email) throws SQLException; } ``` 然后，我们创建一个 UserDaoImpl 类，实现 UserDao 接口，实现具体的操作： ```java public class UserDaoImpl implements UserDao { // 获取数据库连接 private Connection getConnection() throws SQLException { // ... } @Override public void addUser(User user) throws SQLException { String sql = "INSERT INTO users (username, password, email) VALUES (?, ?, ?)"; try (Connection conn = getConnection(); PreparedStatement pstmt = conn.prepareStatement(sql)) { pstmt.setString(1, user.getUsername()); pstmt.setString(2, user.getPassword()); pstmt.setString(3, user.getEmail()); pstmt.executeUpdate(); } } @Override public User findUserByUsername(String username) throws SQLException { String sql = "SELECT * FROM users WHERE username = ?"; try (Connection conn = getConnection(); PreparedStatement pstmt = conn.prepareStatement(sql)) { pstmt.setString(1, username); try (ResultSet rs = pstmt.executeQuery()) { if (rs.next()) { User user = new User(); user.setId(rs.getInt("id")); user.setUsername(rs.getString("username")); user.setPassword(rs.getString("password")); user.setEmail(rs.getString("email")); return user; } else { return null; } } } } @Override public User findUserByEmail(String email) throws SQLException { // 和 findUserByUsername 类似 } } ``` 最后，我们创建一个 UserService 类，调用 UserDao 的方法完成注册功能： ```java public class UserService { private UserDao userDao = new UserDaoImpl(); public void register(User user) throws SQLException { // 判断用户名是否已存在 User u = userDao.findUserByUsername(user.getUsername()); if (u != null) { throw new IllegalArgumentException("用户名已存在"); } // 判断邮箱是否已存在 u = userDao.findUserByEmail(user.getEmail()); if (u != null) { throw new IllegalArgumentException("邮箱已被注册"); } // 添加用户 userDao.addUser(user); } } ``` 这样，我们就完成了一个简单的 JavaWeb 分层实现注册功能的案例。需要注意的是，这里的数据库连接等细节并没有完全实现，需要根据实际情况进行调整。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

夏志121

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值