使用JSP+Servlet+MySQL+Tomcat實現網頁登錄

文章申明:原文章為java jsp+servlet+mysql實現登錄網頁設計,經閱讀后重新編寫了其中的代碼
開發框架:IntelliJ IDEA 2017.2+Maven+Tomcat 8.0+MySQL V5.7

共涉及到下面幾個文件:

1、Maven配置文件 pom.xml
2、servlet 處理類 LoginTestServlet.java
3、登錄頁面 login.jsp
4、成功跳轉頁面 success.jsp
5、失敗跳轉頁面 fail.jsp
6、配置文件 web.xml

---------------------------------文章正文,請依次閱讀------------------------------

  • pom.xml內容
<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/maven-v4_0_0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>com.ken</groupId>
  <artifactId>Login</artifactId>
  <packaging>war</packaging>
  <version>1.0-SNAPSHOT</version>
  <name>Login Maven Webapp</name>
  <url>http://maven.apache.org</url>
  <dependencies>
    <dependency>
      <groupId>org.testng</groupId>
      <artifactId>testng</artifactId>
      <version>6.8</version>
      <scope>test</scope>
    </dependency>
    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>5.1.42</version>
    </dependency>
  </dependencies>
  <build>
    <finalName>Login</finalName>
    <plugins>
      <plugin>
        <groupId>org.apache.maven.plugins</groupId>
        <artifactId>maven-compiler-plugin</artifactId>
        <configuration>
          <source>1.7</source>
          <target>1.7</target>
        </configuration>
      </plugin>
    </plugins>
  </build>
</project>
  • LoginTestServlet.java內容
package com.ken;

import java.io.IOException;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.util.Objects;

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.servlet.http.HttpSession;

import com.mysql.jdbc.Connection;
import com.mysql.jdbc.Statement;

/**
 * Servlet implementation class LoginTestServlet
 * @Description java+mysql+tomcat實現登錄
 * @author xukui
 * @date 2017-7-22 21:22:11
 */
@WebServlet("/LoginTestServlet")
public class LoginTestServlet extends HttpServlet{
    private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#HttpServlet()
     */
    public LoginTestServlet() {
        super();
    }

    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse respone)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doPost(request, response);
    }

    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.setContentType("text/html;charset=gb2312");
        request.setCharacterEncoding("gb2312");

        String result;

        String username = request.getParameter("username");
        String psw = request.getParameter("password");

        if (Objects.equals("", username) || username == null || username.length() > 20) {
            try {
                result = "請輸入用戶名(不能超過20個字符)";
                request.setAttribute("message", result);
                response.sendRedirect("login.jsp");
                return;
            } catch (Exception e) {
                e.printStackTrace();
            }
        }

        if (Objects.equals("", psw) || psw == null || psw.length() > 20) {
            try {
                result = "請輸入密碼(不能超過20個字符)";
                request.setAttribute("message", result);
                response.sendRedirect("login.jsp");
                return;
            } catch (Exception e) {
                e.printStackTrace();
            }
        }

        //登記JDBC驅動程序
        try {
            Class.forName("com.mysql.jdbc.Driver");
        } catch (Exception e) {
            System.out.print("Class Not Found Exception");
        }

        //鏈接URL
        String url = "jdbc:mysql://localhost:3306/study";
        Connection connection;
        Statement statement;
        ResultSet resultSet = null;

        try {
            connection = (Connection) DriverManager.getConnection(url, "root", "root567~");
            statement = (Statement) connection.createStatement();

            String sql = "select * from userInfo where username = '"+username+"' and userpsw = '"+psw+"'";
            resultSet = statement.executeQuery(sql);
        } catch (Exception e) {
            e.printStackTrace();
        }

        HttpSession session = request.getSession();
        session.setAttribute("username", username);

        try {
            assert resultSet != null;
            if (resultSet.next()) {
                session.setAttribute("age", resultSet.getString("age"));
                session.setAttribute("sex", resultSet.getString("sex"));
                session.setAttribute("weight", resultSet.getString("weight"));
                response.sendRedirect("success.jsp");
            } else {
                session.setAttribute("message", "用戶名或密碼不匹配。");
                response.sendRedirect("fail.jsp");
            }
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
}
  • login.jsp內容
<%--
  Created by IntelliJ IDEA.
  User: xukui
  Date: 2017/7/22
  Time: 21:49
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>用戶登錄</title>
</head>
<body>
<form action="LoginTestServlet" name="frmLogin" method="post">
    <h1 align="center">用戶登錄</h1>
    <div align="center">
        <table border="1">
            <tr>
                <td>用戶名:</td>
                <td>
                    <label>
                        <input name="username" value="" size="20" maxlength="20" onfocus="if (this.value==='Your name') this.value='';"/>
                    </label>
                </td>
            </tr>
            <tr>
                <td>密 碼:</td>
                <td>
                    <label>
                        <input type="password" name="password" value="" size="20" maxlength="20" onfocus="if (this.value==='Your Password') this.value='';" />
                    </label>
                </td>
            </tr>
        </table>
        <br/>
        <input type="submit" name="submit" value="Login" onclick="return validateLogin()">
        <input type="reset" name="reset" value="Clear" />
    </div>
</form>

<script type="text/javascript">
    function validateLogin() {
        var sUserName = document.frmLogin.username.value;
        var sPassWord = document.frmLogin.password.value;
        if(sUserName === "") {
            alert("請輸入用戶名!");
            return false;
        }

        if(sPassWord === "") {
            alert("請輸入密碼!");
            return false;
        }
    }
</script>
</body>
</html>
  • success.jsp內容
<%--
  Created by IntelliJ IDEA.
  User: xukui
  Date: 2017/7/22
  Time: 21:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登錄成功</title>
</head>
<body>
<%
    String username = (String) session.getAttribute("username");
    String age = (String) session.getAttribute("age");
    String weight = (String) session.getAttribute("weight");
    String sex = (String) session.getAttribute("sex");
    System.out.println("性別:A" + sex + "A");
    if (sex.trim().equals("M")) {
        sex = "男";
    } else {
        sex = "女";
    }
%>
<div align="center">
    <%=username%>
    <p>歡迎您,登錄成功!</p><br/>
    <label style="color: blue">登錄用戶信息:</label>
    <table border="1">
        <tr>
            <td>姓名:</td>
            <td> <%=username%> </td>
        </tr>
        <tr>
            <td>年齡:</td>
            <td> <%=age%> </td>
        </tr>
        <tr>
            <td>體重:</td>
            <td> <%=weight%> </td>
        </tr>
        <tr>
            <td>性別:</td>
            <td> <%=sex%> </td>
        </tr>
    </table>
    <a href="login.jsp">返回</a>
</div>
</body>
</html>
  • fail.jsp內容
<%--
  Created by IntelliJ IDEA.
  User: xukui
  Date: 2017/7/22
  Time: 21:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登錄失敗</title>
</head>
<body>
<%
    String username = (String) session.getAttribute("username");
    String msg = (String) session.getAttribute("message");
%>
</body>
<div align="center">
    <%=username%>
    <p>對不起,登錄失敗!</p><br/>
    <label style="color: red">原因:</label>
    <%=msg%><br/>
    <br/>
    <p>5秒后將返回登錄界面</p>
</div>

<%
    response.setHeader("Refresh", "5;URL=/Login/login.jsp");
%>
</html>
  • web.xml內容
<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd" id="WebApp_ID" version="3.1">
  <display-name>Archetype Created Web Application</display-name>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
    <welcome-file>index.htm</welcome-file>
    <welcome-file>login.jsp</welcome-file>
    <welcome-file>default.html</welcome-file>
    <welcome-file>default.jsp</welcome-file>
  </welcome-file-list>

  <!-- 添加servlet -->
  <servlet>
    <servlet-name>LoginTestServlet</servlet-name>
    <servlet-class>com.ken.LoginTestServlet</servlet-class>
  </servlet>

  <servlet-mapping>
    <servlet-name>LoginTestServlet</servlet-name>
    <url-pattern>/loginTestServlet</url-pattern>
  </servlet-mapping>
</web-app>
  • 對應的數據庫和表
CREATE DATABASE study;
CREATE TABLE userInfo (
    id INT NOT NULL PRIMARY KEY,
    username CHAR(20) NOT NULL,
    userpsw CHAR(20),
    age INT,
    weight INT,
    sex ENUM('M', 'F')
);
  • 附上運行后的效果
image.png
image.png
image.png
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容