Java Web登录系统实现(不使用开发工具)

我将展示如何手动编写一个基于JSP和Servlet的登录系统,连接MySQL数据库并在Tomcat中运行。

实现思路

  1. 创建数据库和用户表

  2. 编写JSP登录页面

  3. 创建Servlet处理登录逻辑

  4. 配置web.xml

  5. 部署到Tomcat

代码实现

1. 数据库准备

首先创建数据库和用户表:

sql

复制代码
CREATE DATABASE login_system;
USE login_system;

CREATE TABLE users (
    id INT AUTO_INCREMENT PRIMARY KEY,
    username VARCHAR(50) NOT NULL UNIQUE,
    password VARCHAR(100) NOT NULL,
    email VARCHAR(100)
);

INSERT INTO users (username, password, email) VALUES 
('admin', 'admin123', 'admin@example.com'),
('user1', 'password1', 'user1@example.com');

2. 目录结构

text

复制代码
LoginSystem/
├── WEB-INF/
│   ├── web.xml
│   ├── classes/
│   │   ├── com/
│   │   │   └── example/
│   │   │       ├── dao/
│   │   │       │   └── UserDAO.java
│   │   │       ├── model/
│   │   │       │   └── User.java
│   │   │       └── servlet/
│   │   │           └── LoginServlet.java
├── login.jsp
├── welcome.jsp
├── error.jsp
└── META-INF/
    └── context.xml

3. 创建JSP页面

login.jsp - 登录页面

jsp

复制代码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户登录</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f5f5f5;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }
        .login-container {
            background-color: white;
            padding: 30px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            width: 300px;
        }
        h2 {
            text-align: center;
            color: #333;
        }
        .form-group {
            margin-bottom: 15px;
        }
        label {
            display: block;
            margin-bottom: 5px;
            color: #555;
        }
        input[type="text"],
        input[type="password"] {
            width: 100%;
            padding: 8px;
            border: 1px solid #ddd;
            border-radius: 4px;
            box-sizing: border-box;
        }
        button {
            width: 100%;
            padding: 10px;
            background-color: #4CAF50;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-size: 16px;
        }
        button:hover {
            background-color: #45a049;
        }
        .error {
            color: red;
            text-align: center;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <div class="login-container">
        <h2>用户登录</h2>
        <form action="login" method="post">
            <div class="form-group">
                <label for="username">用户名:</label>
                <input type="text" id="username" name="username" required>
            </div>
            <div class="form-group">
                <label for="password">密码:</label>
                <input type="password" id="password" name="password" required>
            </div>
            <button type="submit">登录</button>
        </form>
        <% 
            String error = request.getParameter("error");
            if (error != null) {
        %>
            <div class="error">登录失败,请检查用户名和密码</div>
        <% } %>
    </div>
</body>
</html>

welcome.jsp - 登录成功页面

jsp

复制代码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录成功</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f5f5f5;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }
        .welcome-container {
            background-color: white;
            padding: 30px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            text-align: center;
        }
        h2 {
            color: #4CAF50;
        }
        a {
            color: #4CAF50;
            text-decoration: none;
        }
        a:hover {
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <div class="welcome-container">
        <h2>登录成功!</h2>
        <p>欢迎, <%= session.getAttribute("username") %>!</p>
        <p><a href="login.jsp">返回登录页面</a></p>
    </div>
</body>
</html>

error.jsp - 错误页面

jsp

复制代码
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>错误</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f5f5f5;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }
        .error-container {
            background-color: white;
            padding: 30px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            text-align: center;
        }
        h2 {
            color: #f44336;
        }
        a {
            color: #4CAF50;
            text-decoration: none;
        }
        a:hover {
            text-decoration: underline;
        }
    </style>
</head>
<body>
    <div class="error-container">
        <h2>系统错误</h2>
        <p>抱歉,系统出现错误,请稍后再试。</p>
        <p><a href="login.jsp">返回登录页面</a></p>
    </div>
</body>
</html>

4. 创建Java类

User.java - 用户模型类

java

复制代码
package com.example.model;

public class User {
    private int id;
    private String username;
    private String password;
    private String email;
    
    // 构造函数
    public User() {}
    
    public User(String username, String password) {
        this.username = username;
        this.password = password;
    }
    
    // Getter和Setter方法
    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 String getEmail() {
        return email;
    }
    
    public void setEmail(String email) {
        this.email = email;
    }
}

UserDAO.java - 数据库操作类

java

复制代码
package com.example.dao;

import com.example.model.User;
import java.sql.*;

public class UserDAO {
    private String jdbcURL = "jdbc:mysql://localhost:3306/login_system?useSSL=false";
    private String jdbcUsername = "root";
    private String jdbcPassword = "your_password"; // 替换为你的数据库密码
    
    private static final String SELECT_USER_BY_USERNAME = "SELECT id, username, password, email FROM users WHERE username = ?";
    
    protected Connection getConnection() {
        Connection connection = null;
        try {
            Class.forName("com.mysql.cj.jdbc.Driver");
            connection = DriverManager.getConnection(jdbcURL, jdbcUsername, jdbcPassword);
        } catch (SQLException e) {
            e.printStackTrace();
        } catch (ClassNotFoundException e) {
            e.printStackTrace();
        }
        return connection;
    }
    
    public User selectUser(String username) {
        User user = null;
        try (Connection connection = getConnection();
             PreparedStatement preparedStatement = connection.prepareStatement(SELECT_USER_BY_USERNAME)) {
            preparedStatement.setString(1, username);
            ResultSet rs = preparedStatement.executeQuery();
            
            while (rs.next()) {
                int id = rs.getInt("id");
                String password = rs.getString("password");
                String email = rs.getString("email");
                user = new User(username, password);
                user.setId(id);
                user.setEmail(email);
            }
        } catch (SQLException e) {
            e.printStackTrace();
        }
        return user;
    }
    
    public boolean validate(User user) {
        boolean status = false;
        try (Connection connection = getConnection();
             PreparedStatement preparedStatement = connection.prepareStatement(
                     "SELECT * FROM users WHERE username = ? AND password = ?")) {
            preparedStatement.setString(1, user.getUsername());
            preparedStatement.setString(2, user.getPassword());
            
            ResultSet rs = preparedStatement.executeQuery();
            status = rs.next();
        } catch (SQLException e) {
            e.printStackTrace();
        }
        return status;
    }
}

LoginServlet.java - 登录处理Servlet

java

复制代码
package com.example.servlet;

import com.example.dao.UserDAO;
import com.example.model.User;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

public class LoginServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
    private UserDAO userDAO;
    
    public void init() {
        userDAO = new UserDAO();
    }
    
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        
        User user = new User();
        user.setUsername(username);
        user.setPassword(password);
        
        try {
            if (userDAO.validate(user)) {
                HttpSession session = request.getSession();
                session.setAttribute("username", username);
                response.sendRedirect("welcome.jsp");
            } else {
                response.sendRedirect("login.jsp?error=true");
            }
        } catch (Exception e) {
            e.printStackTrace();
            response.sendRedirect("error.jsp");
        }
    }
}

5. 配置文件

web.xml - Web应用部署描述符

xml

复制代码
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee 
                             http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    
    <display-name>Login System</display-name>
    
    <servlet>
        <servlet-name>LoginServlet</servlet-name>
        <servlet-class>com.example.servlet.LoginServlet</servlet-class>
    </servlet>
    
    <servlet-mapping>
        <servlet-name>LoginServlet</servlet-name>
        <url-pattern>/login</url-pattern>
    </servlet-mapping>
    
    <welcome-file-list>
        <welcome-file>login.jsp</welcome-file>
    </welcome-file-list>
</web-app>

context.xml - 数据库连接配置(可选,放在META-INF目录下)

xml

复制代码
<?xml version="1.0" encoding="UTF-8"?>
<Context>
    <Resource name="jdbc/login_system" 
              auth="Container" 
              type="javax.sql.DataSource"
              maxTotal="100" 
              maxIdle="30" 
              maxWaitMillis="10000"
              username="root" 
              password="your_password" 
              driverClassName="com.mysql.cj.jdbc.Driver"
              url="jdbc:mysql://localhost:3306/login_system?useSSL=false"/>
</Context>

部署步骤

  1. 将MySQL JDBC驱动(mysql-connector-java.jar)复制到Tomcat的lib目录

  2. 将整个LoginSystem文件夹复制到Tomcat的webapps目录

  3. 启动Tomcat服务器

  4. 访问 http://localhost:8080/LoginSystem/

注意事项

  1. 确保数据库用户名和密码正确

  2. 确保MySQL服务正在运行

  3. 如果使用context.xml配置数据源,需要在UserDAO中使用JNDI查找数据源

这个实现提供了一个基本的登录系统,包括用户界面、数据库连接和身份验证功能。您可以根据需要进一步扩展功能,如添加用户注册、密码加密、会话管理等。

相关推荐
宠..12 小时前
创建单选按钮控件
java·服务器·数据库
饼饼饼12 小时前
从 0 到 1:前端 CI/CD 实战 ( 第一篇: 云服务器环境搭建)
运维·前端·自动化运维
用户479492835691513 小时前
给前端明星开源项目Biome提 PR,被 Snapshot 测试坑了一把
前端·后端·测试
SimonKing13 小时前
JetBrains 重大变革:IDEA 2025.3 统一发行版发布,告别选择困难
java·后端·程序员
૮・ﻌ・13 小时前
小兔鲜电商项目(一):项目准备、Layout模块、Home模块
前端·javascript·vue
网安_秋刀鱼13 小时前
【java安全】shiro反序列化1(shiro550)
java·开发语言·安全·web安全·网络安全·1024程序员节
降临-max13 小时前
JavaWeb企业级开发---快速入门、请求响应、分层解耦
java·开发语言·笔记·学习
jiayong2313 小时前
Arthas 完全指南:原理与实战
java·spring·arthas
dy171713 小时前
vue左右栏布局可拖拽
前端·css·html
lsx20240613 小时前
MongoDB 删除文档
开发语言